Angularjs 使用属性而不是服务在指令之间共享数据
我想做一个指令,基本上就像一个专门的输入字段。在一些逻辑和用户输入之后,“value”属性将填充一个逗号分隔的时隙字符串(hh:mm)Angularjs 使用属性而不是服务在指令之间共享数据,angularjs,attributes,angularjs-directive,Angularjs,Attributes,Angularjs Directive,我想做一个指令,基本上就像一个专门的输入字段。在一些逻辑和用户输入之后,“value”属性将填充一个逗号分隔的时隙字符串(hh:mm) 变成 <time-slot value="01:00,02:00,03:00"></time-slot> 我想为任何人提供在“value”属性标记中放置范围引用的灵活性——无论何时更新属性值,范围引用都是如此。(在下面的代码中,myModel.times将在MyController范围内) 我在访问指令中的“value”属性
变成
<time-slot value="01:00,02:00,03:00"></time-slot>
我想为任何人提供在“value”属性标记中放置范围引用的灵活性——无论何时更新属性值,范围引用都是如此。(在下面的代码中,myModel.times将在MyController范围内)
我在访问指令中的“value”属性时没有遇到任何问题但是,我没有实现双向绑定——myModel.times从未捕获更改的值,即使在运行时检查元素时属性的内容已更改。我正在使用$attrs.$set来更改value属性
我不确定我是否在概念上遗漏了一些东西,或者只是遗漏了一些额外的语法。为了使该指令模块化和可共享,我不想使用服务在控制器和指令之间共享数据,也不想使用级联作用域。我认为,如果value属性可以简单地由一个范围变量引用,并根据需要使用,就像一个简单的输入标记一样,那将是最好的:
<input ng-model="model.someText"></input>
双向数据绑定示例:请参阅 在HTML中:
<div ng-controller="MainCtrl">
<time-slots value="value"></time-slots>
</div>
我不知道是否有可能通过这种方式实现它-可能是$attrs。$set只是覆盖属性值并删除插值{{myModel.times}。但是,您是否可以使用具有隔离作用域的指令以及控制器作用域和该隔离作用域之间的双向数据绑定?在该指令中,我认为您使用的是@
范围而不是=
范围-因此这两个绑定不起作用-您没有发布指令的代码,因此我只能做出假设…我意识到我的代码可能正在执行Esa规定的方式。使用@和=?之间的主要区别是什么?这正是我想要的。起初我想知道控制器作用域变量名是否必须是“value”,因为指令作用域引用value:scope:{value:'='},但是这里的“value”引用的是属性名,而不是作用域变量。是的,这正是我想要的。
<input ng-model="model.someText"></input>
angular.module('myApp', [])
.directive('timeSlots', function() {
return {
scope: { value: '=' },
link: function($scope, $elem, $attrs) {
// you can access $scope.value here (after it has been interpolated)
}
};
})
.controller('MainCtrl', ['$scope', function($scope) {
$scope.value = 42;
}]);
<div ng-controller="MainCtrl">
<time-slots value="value"></time-slots>
</div>