指令attr内的callback函数在不同的attr中定义
所以我有这个指令称为， mySave ，这几乎就是这个
app.directive('mySave', function($http) { return function(scope, element, attrs) { element.bind("click", function() { $http.post('/save', scope.data).success(returnedData) { // callback defined on my utils service here // user defined callback here, from my-save-callback perhaps? } }); } });
元素本身看起来像这样
<button my-save my-save-callback="callbackFunctionInController()">save</button>
callbackFunctionInController现在只是
$scope.callbackFunctionInController = function() { alert("callback"); }
当我console.log() attrs.mySaveCallback我的保存指令，它只是给了我一个stringcallbackFunctionInController() ，我读的地方 ，我应该parsing这个，这将是好的，所以我试图$parse(attrs.mySaveCallback) ，这让我回到了一些function，但几乎没有我正在寻找，它让我回来
function (a,b){return m(a,b)}
我究竟做错了什么？ 这种做法是否从一开始就有缺陷？
所以看起来最好的方法是使用ProLoserbuild议的隔离范围
app.directive('mySave', function($http) { return { scope: { callback: '&mySaveCallback' } link: function(scope, element, attrs) { element.on("click", function() { $http.post('/save', scope.$parent.data).success(returnedData) { // callback defined on my utils service here scope.callback(); // fires alert } }); } } });
将parameter passing给控制器可以做到这一点
[11:28] <revolunet> you have to send named parameters [11:28] <revolunet> eg my-attr="callback(a, b)" [11:29] <revolunet> in the directive: scope.callback({a:xxx, b:yyy})
有很多方法可以解决你在做什么。 你应该知道的第一件事情是，只要DOM元素被模板引擎渲染出来， $http.post()就会被调用，就是这样。 如果你把它放在一个重复的地方，这个呼叫将会在中继器中的每一个新的项目完成，所以我的猜测是这绝对不是你想要的。 如果是这样，那么你真的不能正确地devise事物，因为DOM本身的存在不应该决定后端的查询。
无论如何，直接回答你的问题; 如果你阅读$ parse中的蹩脚文档，它会返回一个评估expression式。 当你通过传递作用域来执行这个函数时，你传递的作用域上expression式的当前状态将被返回，这意味着你的函数将被执行。
var expression = $parse(attrs.mySave); results = expression($scope); // call on demand when needed expression.assign($scope, 'newValu'); // the major reason to leverage $parse, setting vals
是的，起初有点混淆，但是您必须明白，asynchronous应用程序中$ scope的变化是不断变化的，而且是在您想要确定价值的时候，而不仅仅是如何。 $parse对于您希望能够分配值的模型的引用更为有用，而不仅仅是读取。
当然，你可能想要阅读创build一个隔离范围或如何$eval()expression式。
$scope.$eval(attrs.mySave);
您可以使用。$ eval在给定的范围内执行语句
app.directive('mySave', function($http) { return function(scope, element, attrs) { $http.post('/save', scope.data).success(returnedData) { // callback defined on my utils service here // user defined callback here, from my-save-callback perhaps? scope.$eval(attrs.mySaveCallback) } } });
TD： 演示
如果你想在一个指令和一个控制器之间共享数据，你可以使用双向绑定
app.controller('AppController', function ($scope) { $scope.callbackFunctionInController = function() { console.log('do something') }; $scope.$watch('somedata', function(data) { console.log('controller', data); }, true); }); app.directive('mySave', function($http, $parse) { return { scope: { data: '=mySaveData', callback: '&mySaveCallback' //the callback }, link: function(scope, element, attrs) { $http.get('data.json').success(function(data) { console.log('data', data); scope.data = data; scope.callback(); //calling callback, this may not be required }); } }; });
演示： 小提琴
scope: { callback: '&mySaveCallback' }
明确地设置范围可能是一个很好的解决scheme，但是如果您想要覆盖原始范围的其他部分，则不能，因为您刚刚覆盖了该范围。 出于某种原因，我还需要到达范围的其他部分，所以我使用了与ng-click相同的实现。
在HTML中使用我的指令：
<div my-data-table my-source="dataSource" refresh="refresh(data)">
在指令内部（没有明确地设置范围）：
var refreshHandler = $parse(attrs.refresh); scope.$apply(function () { refreshHandler( {data : conditions}, scope, { $event: event }); });
有了这个，我可以调用控制器中的函数并将parameter passing给它。
在控制器中：
$scope.refresh= function(data){ console.log(data); }
它正确地打印出条件。
这对我有效
在视图脚本里面
<tag mycallbackattrib="scopemethod">
在指令里面
$scope[attrs.mycallbackattrib](params....);
它被正确地调用，params通过，但也许不是一个最好的“angular度的方式”工作。
你应该使用ng-click而不是创build你自己的指令。
app.directive('mySave', function($http, $parse) { return { scope: { data: '=mySaveData', callback: '&' //the callback }, link: function(scope, element, attrs) { $http.get('data.json').success(function(data) { console.log('data', data); if (scope.callback()) scope.callback().apply(data); }); } }; });
