Vfrdtyky

I am trying to generate dynamically inputs with angular and angular material. Whenever the user clicks on the Add button a new dropdown needs to be generated. Right now I got the following error :

'Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 2 of the expression [{{choiceTest.Name}}] starting at [{choiceTest.Name}}].'

How do I need to modify my code to work properly?

<div ng-repeat="choiceTest in $ctrl.inputsFilterRowsTest">

  <md-input-container flex="30">

    <label>Filter Type</label>

      <md-select ng-model={{choiceTest.Name}} name="">

        <md-option ng-repeat="filter in $ctrl.filters" value="{{filter.value}}">

          {{filter.value}}

         </md-option>

      </md-select>

  </md-input-container>

</div>

<md-button class="md-raised" ng-click="$ctrl.addFilterTest()">ADD</md-button>

Controller

self.inputsFilterRowsTest = ;



self.filters = [

   { value: 'Filter1' },

   { value: 'Filter2' },

   { value: 'Filter3' }

];



self.addFilterTest = function () {

    var newItemTestNo = self.inputsFilterRowsTest.length + 1;

    self.inputsFilterRowsTest.push({ 'value': 'inputFilter' + newItemTestNo, 'name': 'inputFilter' + newItemTestNo });

};

I think the problem might be capitalization: .name vs. .Name:

• 
  

  Template:

  
  
  

   {{choiceTest.Name}}
  
  

  
  


• 
  

  Code:

  
  
  

   self.inputsFilterRowsTest.push({ 'value': 'inputFilter' + newItemTestNo, 'name': 'inputFilter' + newItemTestNo });