케이스 1에서는 ng-click이 동작하지 않지만 케이스 3에서는 동작하는 이유는 무엇입니까?
내가 아직 이해하지 못하는 근본적인 무언가가 분명히 있다.
Angular Ui에서 Modal 모듈을 사용자로 만들려고 합니다.부트스트랩이지만 클릭해도 활성화되지 않습니다.open()
function -- 따라서 다음과 같이 매우 간단한 테스트 케이스로 요약합니다.ng-click이 함수(alert 또는 console.log)를 가리킬 때는 콜이 표시되지 않지만 ng-click이 단순히 표현식인 무언가를 가리킬 때는 동작합니다.
왜?alert
첫 번째 예에서는 호출되지 않았습니까?
<div data-ng-app>
<button data-ng-click="alert('Message 1');">
ngClick -- not working, why not?
</button>
<button onclick="alert('Message 2');">
Plain onclick
</button>
<button data-ng-click="count = (count + 1)">
But this works, why ???
</button>
count: {{count}}
</div>
ng-click
는 현재 스코프의 함수 중 하나와 함께 사용하도록 의도되어 있습니다(예:$scope.alert = window.alert
경고할 수 없는 문제를 해결할 수 있습니다.) 또는 각진 표현.angular에서는 글로벌스코프 메서드를 사용할 수 없는 것 같습니다(현재 검색 중일 수 있습니다).$scope
(이것에는 없습니다).
ng-click
각진 표정을 예상합니다.내부적으로는 angular가 다음을 사용하고 있습니다.$parse
서비스 평가expression
에ng-click="expression"
.
각도 표현식은 일반 Javascript 코드와 다릅니다. $parse
문자열 해석을 사용하여 식을 해석하고 변수, 함수 및 객체에 대한 접근을 의 속성인 것만으로 제한합니다.$scope
오브젝트 또는 속성$parent
프로토타입 상속 체인에서 사용할 수 있는 객체 범위를 지정합니다.
그래서 이론상으로는 다음과 같은 지구촌에 접근할 수 있다.
$scope.window = window;
$scope.alert = alert;
...템플릿에서 다음 작업을 수행합니다.ng-click="window.alert('hello!')"
...혹은... ng-click="alert('hello!')"
또는 한 번만 이 작업을 수행할 수 있습니다.
$rootScope.window = window;
$rootScope.alert = alert;
그리고 프로토타입으로 상속받은 스코프$rootScope
또한 창과 경고에 액세스할 수 있습니다.
... 단, 디버깅을 목적으로 하는 경우를 제외하고 위의 어느 것도 실행하지 않는 타당한 이유가 있습니다.그렇다고 해서 이 모든 걸 꾸미는 게$rootScope
angular의 스코프를 장식하는 것은 항상 나쁜 생각입니다.그 이외의 방법으로 하기에는 매우 어려운 것을 달성할 수 있는 특별한 경우가 적어도 한 가지 있습니다.
ng 디렉티브에서는 그런 종류의 코드를 실행할 수 없습니다.로컬 범위에서 콘텐츠를 찾습니다.
컨트롤러에서 이 작업을 수행할 경우:
$scope.alert = function(){
alert('alerted!');
};
그리고 템플릿에
ng-click="alert()"
javascript 경고가 올바르게 실행됩니다.
「이행」을 정의할 필요가 있습니다.alert
$scope
:
$scope.alert = function(text) {
alert(text);
};
문서의 관련 부분:
AngularJS는 임의의 Javascript 코드를 실행하는 알려진 방법이기 때문에 식 내에서 Window 개체에 대한 액세스를 제한합니다.
https://docs.angularjs.org/error/$parse/isecwindow
https://docs.angularjs.org/guide/expression
<div class="example2" ng-controller="ExampleController">
Name: <input ng-model="name" type="text"/>
<button ng-click="greet()">Greet</button>
<button ng-click="window.alert('Should not see me')">Won't greet</button>
</div>
언급URL : https://stackoverflow.com/questions/23725312/why-does-ng-click-not-work-in-case-1-but-does-in-case-3
'programing' 카테고리의 다른 글
글로벌 변수를 내부 모듈로 호출합니다. (0) | 2023.03.23 |
---|---|
Wordpress에서 하위 디렉토리로 페이지 이동 (0) | 2023.03.23 |
교차 도메인 Ajax가 보안 문제가 되는 이유는 무엇입니까? (0) | 2023.03.23 |
Vim 및 Syntastic에서 발생하는 각 방향성 보풀 오류를 무시하려면 어떻게 해야 합니까? (0) | 2023.03.23 |
TypeError: 정의되지 않은 생성자가 아닙니다. (0) | 2023.03.23 |