ng指數模型沒有約束的指令

我創建了這個非常簡單的指令，叫做<form-field>，我試圖將ng模型綁定到該指令。我已經把這個例子分解爲最簡單的例子，我已經包含了控制器，並且指令中包含HTML格式的指令。我已經看到了很多例子，在使用require:ngModel然後行動發生內部link:的地方，但所有這些例子都只是要麼DOM操作，或增量例如不保存值ng指數模型沒有約束的指令

angular.module('taskApp', []) 
 
    .controller('taskController', function($scope) { 
 
    $scope.taskData = {}; 
 
    $scope.save = function(taskData) { 
 
     $scope.taskData = angular.copy(taskData); 
 
    }; 
 
    }) 
 
    .directive('formField', function($timeout) { 
 
    var template = '<div class="form-group" ng-switch="element">' + 
 
     '<input ng-switch-when="input" ng-model="ngModel" name="{{field}}">' + 
 
     '<textarea ng-switch-when="textarea" ng-model="ngModel" name="{{field}}"></textarea>' + 
 
     '</div>'; 
 
    return { 
 
     restrict: 'EA', 
 
     template: template, 
 
     replace: true, 
 
     scope: { 
 
     ngModel: '=', 
 
     field: '@', 
 
     live: '@', 
 
     element: '@' 
 
     }, 
 
     link: function($scope, element, attr) { 
 

 
     } 
 
    }; 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="taskApp" ng-controller="taskController"> 
 
    <form name='taskForm' novalidate> 
 

 
    <form-field element='input' live='false' field="title" ng-model="taskData.title"></form-field> 
 

 
    <form-field element='textarea' live='false' field="notes" ng-model="taskData.notes"></form-field> 
 

 
    <button type="submit" ng-click="save(taskData)">save</button> 
 

 
    </form> 
 

 
    <br/> 
 
    <pre>{{taskData | json}}</pre> 
 

 
</body>

來源

2015-09-23 kmassada

ngModel您的指令中仍然指內部隔離範圍。您可以使用$parent.ngModel訪問外部模型。

var template = '<div class="form-group" ng-switch="element">' + 
    '<input ng-switch-when="input" ng-model="$parent.ngModel" name="{{field}}">' + 
    '<textarea ng-switch-when="textarea" ng-model="$parent.ngModel" name="{{field}}"></textarea>' + 
    '</div>';

來源

2015-09-23 14:59:24

是那裏「注入」父範圍爲指令申報像'.directive（函數（$超時，$ parent.scope）'的方式，你能解釋一下怎麼來它是一個$父，而不是兄弟姐妹？ – kmassada

http://stackoverflow.com/a/17900556/1095800我正在閱讀這個答案，它看起來像$父不建議。也許有一種方法，而在我的範圍內綁定'範圍{ngModel ：= $ parent.ngModel}' – kmassada

@kmassada你可以通過在你的鏈接函數中注入的'$ scope'變量訪問父範圍：'$ scope。$ parent'。我還沒有討論爲什麼'$ parent '不推薦...至於說明，我遇到同樣的問題時使用的Angular版本實際上沒有使用'$ parent'，所以它必須是內部的改變，我不知道。你也可以在你的指令中使用'scope：true'，它不會創建一個隔離範圍，並且允許你不使用'$ parent'。 –

ng指數模型沒有約束的指令

回答

相關問題