我正在创建一个指令:
<div custom-directive option1="Sam" option2="Pam" modelname="position.name">
我想分配option1和option2(它取决于我点击哪个)作为我在全局范围创建的范围的值,其中modelname作为范围的名称。
和指令定义就是这样
user.directive('customDirective',['$parse',function($parse){
return{
restrict: 'A',
scope: 'false', //because i want to expose the scope globally
link: function(scope,iElement,iAttrs){
// create a scope with modelname as its name;
using $parse maybe.. but i dont know how ..
// create the template for the directive
var optionElement1 = angular.element( "<span>"+iAttrs['option1']+"</span>");
var seperator = angular.element("<span>"+" / "+"</span>");
var optionElement2 = angular.element("<span>"+iAttrs['option2']+"</span>");
iElement.append(optionElement1).append(seperator).append(optionElement2);
optionElement1.click(function(){
// assign iAttrs['option1'] to the scope created
})
optionElement2.click(function(){
// assign iAttrs['option2'] to the scope created
})
}
}
}])
答案 0 :(得分:0)
我自己想通了。发布它以防万一有人面临同样的问题..
我使用ngModelController来做,只使用ng-model而不是modelname属性
<div custom-directive option1="Sam" option2="Pam" ng-model="position.name">
在指令定义中:
user.directive('customDirective',[function(){
return{
restrict: 'A',
require: 'ngModel',
link: function(scope,iElement,iAttrs,ctrl){
var optionElement1 = angular.element( "<span>"+iAttrs['option1']+"</span>");
var seperator = angular.element("<span>"+" / "+"</span>");
var optionElement2 = angular.element("<span>"+iAttrs['option2']+"</span>");
iElement.append(optionElement1).append(seperator).append(optionElement2);
optionElement1.click(function(){
scope.$apply(function() {
ctrl.$setViewValue(iAttrs['option1']);
});
})
optionElement2.click(function(){
scope.$apply(function() {
ctrl.$setViewValue(iAttrs['option2']);
});
})
}
}
}])