컨트롤러 함수에 대한 호출이 기능하지 않는 각도 ng클릭
변수를 다른 컨트롤러에 전달해야 합니다.ListCtrl과 관련된 다음 코드를 가지고 있습니다.
<a href="#items" data-router="article" ng-click="changeListName('metro')">
링크는 다른 컨트롤러 ItemCtrl로 이동합니다.
ItemCtrl에 변수를 전달하고 싶다.Shared Properties라는 서비스를 사용할까 생각 중입니다.
service('sharedProperties', function () {
var list_name = '';
return {
getListName: function() {
return list_name;
},
setListName: function(name) {
list_name = name;
}
};
});
링크를 클릭하면 angular click 이벤트를 호출하여 다음 함수를 트리거합니다.
$scope.changeListName = function(name) {
sharedProperties.setListName(name);
};
그러나 ng-click을 사용해도 공유 속성의 값은 변경되지 않습니다.
갱신하다
ng-click에 의해 트리거된 기능 내에 경고를 넣었더니 당연히 경고가 트리거됩니다.
단, 제 기능을 이렇게 쓸 때는 다음과 같습니다.
$scope.changeListName = function(name) {
sharedProperties.setListName(name);
};
효과가 없어...'shared Properties'처럼 보입니다.setListName(이름);'은 실행되지 않습니다...
더미네임(예를 들어 메트로)을 사용하여 기능 외부에 배치하면 작동합니다.
업데이트 3
여러 가지 시도를 해봤는데, 이 기능에 문제가 있다고 확신합니다.
$scope.changeListName = function(list_name) {
sharedProperties.setListName(list_name);
};
왜 이런 일이 일어나는지 아십니까?
ngHref 디렉티브를 ngClick과 함께 사용해야 합니다.
<a ng-href='#here' ng-click='go()' >click me</a>
다음은 예를 제시하겠습니다.http://plnkr.co/edit/FSH0tP0YBFeGwjIhKBSx?p=preview
<body ng-controller="MainCtrl">
<p>Hello {{name}}!</p>
{{msg}}
<a ng-href='#here' ng-click='go()' >click me</a>
<div style='height:1000px'>
<a id='here'></a>
</div>
<h1>here</h1>
</body>
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
$scope.go = function() {
$scope.msg = 'clicked';
}
});
사용하시는 라이브러리에서 동작할지는 모르겠지만 적어도 링크하여 ngClick 기능을 사용할 수 있습니다.
** 업데이트 **
세트 데모입니다만, 서비스도 잘 되고 있습니다.
http://plnkr.co/edit/FSH0tP0YBFeGwjIhKBSx?p=preview
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope, sharedProperties) {
$scope.name = 'World';
$scope.go = function(item) {
sharedProperties.setListName(item);
}
$scope.getItem = function() {
$scope.msg = sharedProperties.getListName();
}
});
app.service('sharedProperties', function () {
var list_name = '';
return {
getListName: function() {
return list_name;
},
setListName: function(name) {
list_name = name;
}
};
});
* 편집 *
폐고와 각도의 사용법에 대해 설명하는 https://github.com/centralway/lungo-angular-bridge를 검토하십시오.또한 다른 링크를 참조할 때 페이지를 완전히 새로고침하는 경우 공유 속성을 로컬 스토리지 및/또는 쿠키에 유지해야 합니다.
각도 구성에서 컨트롤러를 정의할 때 별칭을 사용합니다.예: 메모: 여기서 TypeScript를 사용하고 있습니다.
컨트롤러에는 homeCtrl이라는 별칭이 있습니다.
module MongoAngular {
var app = angular.module('mongoAngular', ['ngResource', 'ngRoute','restangular']);
app.config([
'$routeProvider', ($routeProvider: ng.route.IRouteProvider) => {
$routeProvider
.when('/Home', {
templateUrl: '/PartialViews/Home/home.html',
controller: 'HomeController as homeCtrl'
})
.otherwise({ redirectTo: '/Home' });
}])
.config(['RestangularProvider', (restangularProvider: restangular.IProvider) => {
restangularProvider.setBaseUrl('/api');
}]);
}
그리고 여기 그것을 사용하는 방법이 있습니다.
ng-click="homeCtrl.addCustomer(customer)"
한번 해봐.나한테도 먹혔던 것처럼 너한테도 먹힐지도 몰라;)
에러가 나지 않았거나 언급했을 거라고 추측합니다.이 경우, 이 파일을 삭제해 주세요.href
속성 값을 지정하면 코드가 실행되기 전에 페이지가 이동하지 않습니다.Angular에서는 떠나는 것이 완벽하게 허용됩니다.href
속성은 공백입니다.
<a href="" data-router="article" ng-click="changeListName('metro')">
나는 ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★data-router
그래도 제대로 된 결과가 나오지 않으면 그럴 수도 있어요.
언급URL : https://stackoverflow.com/questions/17457024/angular-ng-click-with-call-to-a-controller-function-not-working
'it-source' 카테고리의 다른 글
화면으로 돌아가면 React Native에서 useEffect가 호출되지 않음 (0) | 2023.03.17 |
---|---|
Spring Boot : 데이터베이스에서 @Scheduled cron 값을 가져옵니다. (0) | 2023.03.17 |
config() 모듈에서의 의존관계 주입: 각도JS (0) | 2023.03.17 |
Spring Boot 및 Logback을 사용하여 콘솔에 대한 휴지 상태 로깅을 피할 수 없음 (0) | 2023.03.17 |
React-Router와의 액티브링크 (0) | 2023.03.17 |