간단한 AngularJS 앱을 만들고 있지만 서비스, ng-repeat 및 동적으로 추가 된 데이터와 관련된 문제를 해결할 수 없습니다.
내가하려는 것
내 페이지는 몇 개의 카운트 롤러로 나뉩니다. 에서 homeController나는 텍스트 필드와 버튼이 있습니다. 버튼을 누르면 서버에 대한 API 호출을 수행하고 서버는 JSON을 반환하고 데이터를 Storage서비스로 설정합니다 . 이 부분에서는 모든 것이 정상입니다-서버는 데이터를 반환해야하며 데이터는 서비스 console.log('Data set!');로 설정되며 스토리지 서비스에 들어갑니다. 두 번째 컨트롤러 ( slidesController)에서 나는ng-repeat
<div ng-controller="slidesCtrl">
<div ng-repeat="current in paragraphs"> test </div>
</div>
그리고 아래 코드에서 볼 수 있듯이 값에 paragraphs바인딩됩니다 Storage.data.slidesCtrl
따라서 사용자가 상자에 무언가를 입력하고 버튼 (homeCtrl)을 누르면 서버는 반환 된 데이터를 Storage서비스에 전달하고 ng-repeat (slideCtrl)를 사용하여 데이터를 렌더링해야합니다. 예를 들어 [2, 3, 4, 5]를 사용하여 스토리지 서버의 데이터를 하드 코딩하면 모든 것이 정상입니다 (ng-repeat 때문에 테스트를 4 번 받고 있습니다).하지만 데이터가 api 호출로 취해지면, ng-repeat가 작동하지 않습니다.
암호
App.controller('homeCtrl', function ($scope, $http, Api) {...
$scope.onprocess = function () {
$scope.loading = true;
Api(.....);
}
});
App.controller('slidesCtrl', function ($scope, Storage) {
$scope.paragraphs = Storage.data.paragraphs; // NOT WORKING IF DATA IS DYNAMICALLY ADDED
$scope.paragraphs = Storage.test; // IF DATA IS PREDEFINED EVERYTHING IS FINE
});
App.factory('Api', function ($http, Storage) {
return function (data) {
$http.post('/api', {
url: data.url,
analyze: 0
}).success(function (res) {....
Storage.set(res);....
}).error(function () {....
});
};
});
App.factory('Storage', function () {
var output = {};
var set = function (data) {
output = data;
console.log('Data set!');
};
return {
set: set,
data: output,
test: [1, 2, 3]
};
});
나는 발견했다
angular.copy(data, output);
해결책으로.
서비스 AngularJS를 사용하여 두 컨트롤러간에 동적 데이터 공유이 항목에 대한 자세한 정보를 볼 수 있습니다.
모두에게 감사 드려요.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다