gpt4 book ai didi

javascript - AngularJS 指令双向绑定(bind)在 Ionic 中不起作用

转载 作者:行者123 更新时间:2023-11-28 10:53:52 26 4
gpt4 key购买 nike

我无论如何也无法解决这个问题;我什至无法弄清楚这是 AngularUI Router 还是 Ionic 本身的问题。

我正在尝试使用自定义 AngularJS 指令完成双向绑定(bind)(即指令定义中的 scope: {data: "="}),它完美地工作,如 this jsfiddle 所示,但是在我的特定上下文中使用的相同代码(即:在使用“更改数据”按钮到达页面之前我导航通过两个状态)不会(jsfiddle here)。

SO 提示我添加一些代码以沿着 jsfiddle 链接,所以这里是工作版本。

页面:

<!-- HTML -->
<body ng-app="myApp">
<div ng-controller="MyCtrl">
<signature data="signatureData"></signature>
<button ng-click="changeData()">Change data!</button>
</div>
</body>

脚本:

//JS
angular.module("myApp", [])
.controller("MyCtrl", ["$scope", function ($scope) {
$scope.changeData = function() {
console.log("Outside directive:", $scope.signatureData);
$scope.signatureData = "hello";
};
}])
.directive("signature", [function() {
var directiveDefinitionObject = {
template: "<div>Don't mind me, I'm just a template...</div>",
scope: {
data: "="
},
controller: ["$scope", "$element", function($scope, $element) {
$scope.data = "ciao";
$scope.$watch("data", function(d) {
console.log("Inside directive:", d);
});
}]
};
return directiveDefinitionObject;
}]);

/* Console output when clicking button:
Inside directive: ciao
Outside directive: ciao
Inside directive: hello
*/

相同的代码,虽然放在上下文中,但在第二个 fiddle 中,它太冗长了,无法粘贴到这里(对此我表示歉意,我已经尽可能地略读了它,但这只是为了理解这个问题,以防万一有帮助)。

但是,控制台输出是:

/* Console output when clicking button:
Inside directive: ciao
Outside directive: undefined
*/

最佳答案

在调用 $scope.signatureData = "hello"; 之前未定义 $scope.signatureData

尝试在访问该 Controller 时定义签名数据...

.controller("JobRegistrationCtrl", ["$scope", function ($scope) {
$scope.signatureData = "ciao"; //Now it's defined
$scope.changeData = function() {
console.log("Outside directive:", $scope.signatureData);
$scope.signatureData = "hello";
};
}])

关于javascript - AngularJS 指令双向绑定(bind)在 Ionic 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28175160/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com