2016-06-07 10 views
1

Ich bin dynamisch hinzufügen ein Textfeld in DOM (von Direktiven Link-Funktion) & möchte eingegebener Wert greifen und schieben Sie es auf Controller-Objekt, aber es gibt immer undefined, unten ist meine code:Zwei-Wege-Bindung Direktive + Controller

<div class="input-group"> 
    <span class="fieldIcon input-group-addon"><i class="fa fa-sticky-note" aria-hidden="true"></i></span> 
    <select name="addlist[]" multiple="multiple"> 
     <option ng-repeat="options in optionList">{{options.label}}</option> 
    </select> 
</div> 
<script type="text/javascript"> 
    angular.module('myapp') 
    .controller('AddContactController',[ '$scope', function ($scope) { 
     $scope.optionList = [{label: 'NewList'}];   

     $scope.addOption = function(optionList) { 
      console.log('List:', optionList); // its giving undefined 
      scope.optionList.push(optionList); 
     } 

    }]) 
    .directive('optionList', ['$compile', function ($compile) { 
     return { 
      restrict: 'E', 
      templateUrl: '/templates/int_optionList.html', 
      controller: 'AddContactController', 
      link: function(scope, element, attrs) { 
       // Adding input field and on click of a button controllers addOption function should be called with the text field value 
       var addListField = '<input class="form-control" type="text" ng-modal="addList" name="addList" placeholder="Add new list...">'+ 
       +'<button class="btn btn-default" type="button" ng-click="addOption()">'; 

       addListField = $compile(addListField)(scope); 
       $(element).find('.multiselect-container').prepend(addListField); 
      } 
     } 
    }]); 
</script> 

Jetzt hier in addOption Funktion Ich bekomme OptionList Wert als undefined.

+0

'addOption' erwartet ein Argument, aber Sie übergeben kein Argument. – zeroflagL

+0

Ja Entschuldigung dafür, in der tatsächlichen Code habe ich beim Posten hier verpasste ich es, so sogar mit diesem Argument, immer noch undefiniert. Hinweis: Bearbeitet meinen Beitrag –

+0

Sie verwenden nicht tatsächlich die 'Option-Liste' Direktive irgendwo in Ihrem Vorlagencode, so wird die Link-Funktion der Richtlinie sogar feuern? –

Antwort

1

Fehler ist menschlich :). Ersetzen Sie ng-modal durch das ng-Modell in Ihrer Anweisung

0

AngularJS erwartet, dass Modelle in Objektform vorliegen, wobei die Einstellung ng-modal = "addList" zu ng-modal = "data.addList" hilfreich sein kann.

+0

Das ist nicht wahr. Es ist eine gute Praxis (wie auch mit ControllerAs, die dies "erzwingen"), aber nicht etwas eckigen erwartet. –

Verwandte Themen