5
Tôi vừa mới bắt đầu với AngularJS và tôi đang cố gắng chia sẻ dữ liệu giữa hai bộ điều khiển ng (cả hai bộ điều khiển nằm trong cùng một mô-đun ng-app) sử dụng một nhà máy. Dữ liệu (trường nhập HTML) từ controller1 dường như được chia sẻ với controller2 hầu hết các lần; nhưng khi tôi xóa tất cả nội dung của trường nhập, đồng hồ $ dường như không hoạt động! Tôi thấy khó giải thích bằng lời. Ảnh chụp màn hình bên dưới có thể hữu ích.
Dưới đây là mã của tôi:
<!DOCTYPE html>
<html>
<head>
<% include ../partials/head %>
</head>
<body class="container" ng-app='myApp'>
<div ng-controller="ctrl1">
<input type="text" ng-model="firstName">
<br>
Input is : <strong>{{firstName}}</strong>
</div>
<div ng-controller="ctrl2">
Input should also be here: {{firstName}}
</div>
<script>
var myApp = angular.module('myApp', []);
myApp.factory('Data', function() {
var data = {
FirstName: ''
}
return {
getFirstName: function() {
return data.FirstName;
},
setFirstName: function (x) {
data.FirstName = x;
}
}
});
myApp.controller('ctrl1', function ($scope, Data) {
$scope.firstName = ''
$scope.$watch('firstName', function(newVal){
if(newVal){Data.setFirstName(newVal);}
});
});
myApp.controller('ctrl2', function ($scope, Data) {
$scope.$watch(function(){return Data.getFirstName();}, function(newVal){
if(newVal){$scope.firstName = newVal;}
});
});
</script>
</body>
<footer>
<% include ../partials/footer %>
</footer>
</html>
Ngoài ra còn có một jsfiddle tôi tìm thấy cho mã này. http://jsfiddle.net/5LL3U/2/
Mọi trợ giúp đều được đánh giá cao. Cảm ơn!
này được dựa trên một ví dụ trong một trong những câu trả lời cũ của tôi và đó là sai. Vì vậy, tôi xin lỗi và sẽ cập nhật nó :) Nó nên sử dụng 'oldValue' và làm:' if (newValue! == oldValue) ' – tasseKATT
Cảm ơn bạn @tasseKATT. Hãy tiếp tục phát huy! chúc mừng :) –
Và cảm ơn vì đã nhận thấy lỗi :) – tasseKATT