我仔细阅读了关于该主题的AngularJS文档,然后使用指令进行了调整.这是小提琴.
以下是一些相关的片段:
来自HTML:
<pane bi-title="title" title="{{title}}">{{text}}</pane>
Run Code Online (Sandbox Code Playgroud)从窗格指令:
scope: { biTitle: '=', title: '@', bar: '=' },
Run Code Online (Sandbox Code Playgroud)我有几件事没有得到:
"{{title}}"与'@'和"title"使用'='?我找到了另一个显示表达式解决方案的小提琴:http://jsfiddle.net/maxisam/QrCXh/
angularjs angularjs-directive angularjs-scope isolated-scope
我试图从我的自定义指令获取一个评估属性,但我找不到正确的方法.
我已经创建了这个jsFiddle来详细说明.
<div ng-controller="MyCtrl">
<input my-directive value="123">
<input my-directive value="{{1+1}}">
</div>
myApp.directive('myDirective', function () {
return function (scope, element, attr) {
element.val("value = "+attr.value);
}
});
Run Code Online (Sandbox Code Playgroud)
我错过了什么?
我已经阅读了很多关于在AngularJS中实现自定义指令时使用这些符号的内容,但这个概念对我来说仍然不清楚.我的意思是,如果我在custom指令中使用其中一个范围值,这意味着什么?
var mainApp = angular.module("mainApp", []);
mainApp.directive('modalView',function(){
return{
restrict:'E',
scope:'@' OR scope:'&' OR scope:'=' OR scope:'>' OR scope:true
}
});Run Code Online (Sandbox Code Playgroud)
我们究竟在这里做什么?
我也不确定官方文件中是否存在"范围:'>'".它已在我的项目中使用.
编辑-1
使用"scope:'>'"是我项目中的一个问题,并且已经修复.
我正在编写一个自定义<pagination>指令,它将返回负责更改当前页面和分页设置的元素(例如,每页将显示多少项).该指令具有隔离范围(使其更具可重用性).
在指令模板中,我需要调用像changePage()或的函数changePaginationSettings().在目前为止我发现的隔离范围内传递函数的唯一方法是在控制器中定义函数.
mainController.js
module.controller("mainController", function($scope) {
$scope.changePage = function() { ... };
});
Run Code Online (Sandbox Code Playgroud)
然后将其作为属性传递给指令:
pagination.js
module.directive("pagination", function() {
return {
restrict: "E",
scope: {
changePage: "="
},
templateUrl: "templates/pagination.html"
}
}
Run Code Online (Sandbox Code Playgroud)
pagination.html
<pagination change-page="changePage">
Run Code Online (Sandbox Code Playgroud)
这看起来非常难看,因为它将相关代码拆分为2个不相关的文件.那个changePage()函数应该在pagination.js文件中定义,而不是在mainController.js中定义.
我认为这样的事情应该是可能的:
pagination.js
module.directive("pagination", function() {
function changePage() { ... };
return {
restrict: "E",
scope: {
changePage: changePage
},
templateUrl: "templates/pagination.html"
}
}
Run Code Online (Sandbox Code Playgroud)
但是这样的代码产生了一个(对我来说毫无意义)错误:Error: definition.match is not a function.
有没有办法实现这一目标?我的意思是在隔离的指令范围内传递在同一文件中定义的函数.
我已经阅读过 …
我是angularjs的新手.我有一个要求,我在每个部分HTML中一次又一次地使用相同的单选按钮.所以,我想把它作为一个通用模板,并在其他部分模板中使用它.
<ng-include src="'partial-htmls/toolbox/radio-button.html'"></ng-include>
Run Code Online (Sandbox Code Playgroud)
其中显示单选按钮如下:
Sex : O Male
O Female
Run Code Online (Sandbox Code Playgroud)
这很好但我需要以某种方式改变标签,文本和单选按钮的数量ng-include.(我想通过以某种方式传递params来做)
I am from background of lodash, where it can be easily handled. I thought there might be a way in angular too.
Please help.