각도에서 ng-click not fireing in Angular클릭 시 JS가 실행됩니다.

각도에서 ng-click not fireing in Angular클릭 시 JS가 실행됩니다.

Angular를 사용하려고 합니다.JS는 제 지원서에 있고 어느 정도 성공적이었습니다.

나는 데이터를 가져와서 사용자에게 보여줄 수 있습니다.그리고 단추가 들어있습니다.ng-repeatDELETE 요청을 게시하고 싶습니다.아래는 그것을 하는 나의 코드입니다.

<div class="navbar-collapse collapse">
    <table class="table table-striped" ng-controller="FetchViewData">
        <tr>
            <td>Name</td>
            <td>ID</td>
            <td>Department</td>
            <td></td>
        </tr>
        <tr ng-repeat="d in viewData">
            <td>{{d.EmployeeName}}</td>
            <td>{{d.EmployeeID}}</td>
            <td>{{d.EmployeeDepartment}}</td>
            <td>
                <button class="trashButton" type="button" 
                name="view:_id1:_id2:_id14:_id24:btnDelete" 
                id="view:_id1:_id2:_id14:_id24:btnDelete" 
                ng-click="deleteRecord('{{d['@link'].href}}')">
                <img src="/trashicon.gif"></button>
            </td>
        </tr>
    </table>
</div>

여기가.FetchViewData정보를 가져와 사용자에게 표시하는 기능.

function FetchViewData($scope, $http) {
    var test_link = "<MY LINK>";
    $http.get(test_link).success( function(data) {
        $scope.viewData = data;
    });
}

데이터가 가져오기되고 올바르게 표시됩니다.

하지만 코드는ng-click="deleteRecord('{{d['@link'].href}}')"삭제 버튼을 클릭해도 실행되지 않습니다.Google Chrome의 개발자 도구에서 코드에 대해 유효한 값이 생성되는 것을 볼 수 있습니다.{{d['@link'].href}}하지만 코드는deleteRecord잘리지 않습니다.이 질문을 통해 교정기를 제거하고 글만 쓰도록 했습니다.d['@link'].href하지만 제겐 효과가 없었어요

교체할 때ng-click와 함께onclick그deleteRecord함수가 발사됩니다.

function deleteRecord(docURL) {
    console.log(docURL);

    $http.delete(docURL);
}

그런데 다음 오류가 발생합니다.

Uncaught ReferenceError: $http is not defined
deleteRecord
onclick

저는 jQuery 1.10.2와 Angular를 사용하고 있습니다.JS v1.0.8.

FetchViewData 여기에는 컨트롤러가 있고 html에는 ng-controller=가 있습니다."FetchViewData(데이터 가져오기)", 각진 메서드 및 변수에 대해 해당 컨트롤러의 범위 내에서 살펴보라는 것입니다.

즉, 클릭 시 메소드를 호출하려면 컨트롤러 범위에 연결된 메소드를 호출해야 합니다.

function FetchViewData($scope, $http) {
    var test_link = "<MY LINK>";
    $http.get(test_link).success( function(data) {
        $scope.viewData = data;
    });
    $scope.deleteRecord = function(docURL) {
        console.log(docURL);

        $http.delete(docURL);
    }   
}

여기서 함수는 스코프에 존재하며 FetchView Data Controller 내부에 있는 html은 해당 스코프에 액세스할 수 있으며 메서드를 호출할 수 있습니다.

온클릭을 사용할 때 기능이 글로벌 네임스페이스에 존재하기 때문에 온클릭을 사용할 때 작동합니다.Angular는 이름 공간을 깨끗하게 유지하기 위해 범위 지정에 매우 많이 의존합니다. 여기에는 많은 정보가 있습니다. https://github.com/angular/angular.js/wiki/Understanding-Scopes

이것 대신에

ng-click="deleteRecord('{{d['@link'].href}}')"

이거 먹어봐요.

ng-click="deleteRecord(d['@link'].href)"

ng클릭에서 컬릭괄호({})를 사용할 필요가 없습니다.

즐기세요...

  function deleteRecord(docURL) {
       console.log(docURL);

       $http.delete(docURL);
 }

그럴 것 같네요.

 $scope.deleteRecord = function (docURL) {
         console.log(docURL);

         $http.delete(docURL);
}

편집: html과 컨트롤러에서 무언가를 변경합니다..

작업 데모 참조

그deleteRecord현재 및 정확한 범위에서 방법을 할당해야 합니다.

$scope.deleteRecord = function(){
....

그 이유에 대한 또 다른 가능성.ng-click발사되지 않습니다. CSS 스타일을 적용하고 있다는 것입니다.pointer-events:none;요소에 맞게부트스트랩이form-control-feedback수업은 그 스타일을 적용합니다.그래서, 그것이 비록 그것을 상승시킴에도 불구하고.z-index요소가 클릭할 때 앞에 있도록 2씩 설정하면 마우스 clicks이 비활성화됩니다!

따라서 프레임워크가 상호 작용하는 방식에 주의해야 합니다.

언급한 바와 같이, 함수는 스코프 내부에서 생성되어야 합니다.

 $scope.deleteRecord = function (docURL) {
         console.log(docURL);

         $http.delete(docURL);
}

이 기능을 사용하려면 먼저 "{{}}}"을 떨어뜨리십시오(ng-repeat).또 다른 문제는 코드에 아포스트로피를 사용한다는 것입니다. 한 쌍은 다른 쌍 안에 있고...저는 당신이 그것에 대해 문제가 있다고 확신합니다.

다음과 같은 기능을 사용합니다.

ng-click="deleteRecord(d['@link'].href)"

행운을 빌어요!

제출 버튼으로 사용하려면 다음과 같이 유형을 '제출'로 설정합니다.

<button type="submit" ...

언급URL : https://stackoverflow.com/questions/19512572/ng-click-not-firing-in-angularjs-while-onclick-does