use*_*387 10 javascript href angularjs nvd3.js
我正在使用一个库,它将href元素附加到标记上.在这个链接上,我需要调用范围内的angularjs函数.就像是...
<a href="{{someFunction()}}"></a>
Run Code Online (Sandbox Code Playgroud)
注意:我通过javascript从另一个库(nvd3.js)附加这个href实际上并没有写这个,因为如果我是,我可以轻松地使用ng-click或ng-href.
小智 19
所以我对这个答案并不满意,因为它并没有真正使用优雅的角度解决方案.
这是我的解决方案:http://jsfiddle.net/jjosef/XwZ93
HTML:
<body class="wrapper" ng-app="ExampleApp">
<a my-href="buildUrl('one', aVariable, 'three')">This is my a tag with a function that builds the url</a>
</body>
Run Code Online (Sandbox Code Playgroud)
JS:
angular.module('ExampleApp', []);
angular.module('ExampleApp').run(function($rootScope) {
$rootScope.buildUrl = function() {
var link = [];
for(var i = 0; i < arguments.length; i++) {
link.push(arguments[i].toLowerCase());
}
return '/#!/' + link.join('/');
};
$rootScope.aVariable = 'two';
});
angular.module('ExampleApp').directive('myHref', function($parse) {
return {
restrict: 'A',
link: function(scope, element, attrs) {
var url = $parse(attrs.myHref)(scope);
element.attr('href', url);
}
}
});
Run Code Online (Sandbox Code Playgroud)
mne*_*syn 14
这有点令人费解.
CAVEAT:这非常,非常hacky,绝对正是你不应该做的角度,但我猜你知道这个和图书馆让你的生活变得艰难......
首先,不像onclick,href不会将字符串解释为javascript.相反,你必须使用
<a href="javascript:someFunction()"></a>
Run Code Online (Sandbox Code Playgroud)
但仅此一点不会使它工作,因为someFunction()它不是一个方法document,而是在控制器上,所以我们需要先得到控制器:
<a href="javascript:angular.element(
document.getElementById('myController')).scope().someFunction();"></a>
Run Code Online (Sandbox Code Playgroud)
Where myController指的是用ng-controller例如装饰的DOM元素
<div data-ng-controller="SomeController" id="myController"> ... </div>
Run Code Online (Sandbox Code Playgroud)
如果someFunction修改了视图的状态,你还需要使用$scope.apply,即
<a href="javascript:angular.element(document.getElementById('myController')).
scope().$apply(someFunction)"></a>
Run Code Online (Sandbox Code Playgroud)
请注意,您不需要{{ }}语法,因为您直接调用javascript,而不是要求angular修改标记.
| 归档时间: |
|
| 查看次数: |
40039 次 |
| 最近记录: |