AngularJS 단일 페이지 응용 프로그램 : 참조 오류, ____이 정의되지 않았습니다.

내 단일 페이지 응용 프로그램에서 특히 javascript 파일에서 reroll 함수에 대한 캐치되지 않은 참조에 대한 오류가 발생합니다. 이 문제의 원인을 이해하지 못합니다. 내 js 파일 설정이 잘못된 방법입니까? 언급 된 특정 오류는 참조 오류입니다. reroll이 정의되지 않았습니다.AngularJS 단일 페이지 응용 프로그램 : 참조 오류, ____이 정의되지 않았습니다.

HTML :

<body ng-app="app"> 
    <!-- == Main Controller for SPA == --> 
    <div class="container-fluid bg-dark text-white" style="height:700px" ng-controller="mainCtrl"> 
    <!-- == App Title == --> 
    <h2 class="display-2 title-container text-center">{{main.title}}</h2> 
    <div class="row"> 
     <div class="container-fluid word-container text-center"> 
     <!-- == User Phrase Input == --> 
     <input type="text" ng-model="word" placeholder="Please enter word"> 
     <br> 
     <br> 
     </div> 
    </div> 
    <div class="row"> 
     <div class="container-fluid anagram-container text-center"> 
     <!-- == Final anagram == --> 
     Anagram: {{anagram}} 
     </div> 
    </div> 
    <div class="row"> 
     <div class="container-fluid button-container text-center"> 
     <!-- Anagram "Reroll" Button --> 
     <button type="button" ng-click="reroll(word)" class="btn btn-primary btn-large">Reroll</button> 
     <!-- Anagram "Clear" Button --> 
     <button type="button" class="btn btn-primary btn-large" ng-click="word=''">Clear</button> 
     </div> 
    </div> 
    </div> 
</body>

자바 스크립트 :

var app = angular.module("app", []); 
app.controller('mainCtrl', function($scope) { 
    $scope.main = {}; 
    $scope.main.title = "AnagramJS"; 
    $scope.reroll = function reroll(value) { 
    // set anagram to randomize 
    $scope.anagram = value.split('').sort(function() { 
     return 0.5 - Math.random() 
    }).join(''); 
    }; 
    $scope.$watch('word', (newVal, oldVal) => { 
    if (newVal) { 
     reroll(newVal); 
    } else { 
     // empty anagram if word is empty 
     $scope.anagram = ""; 
    } 
    }); 
    angular.extend($scope, { 
    reroll 
    }); 
});

출처

2017-10-20 FreshOceans

난 당신이'angular.extend을 제거 할 필요가 있다고 생각 제거해야한다 ($ scope, { reroll }), ' – Satpal

reroll(newVal)는 $scope.reroll(newVal);

는 또한

angular.extend($scope, { 
    reroll 
});

출처

2017-10-20 11:33:13

감사합니다 !! 그것은 효과가 있었다. – FreshOceans

AngularJS 단일 페이지 응용 프로그램 : 참조 오류, ____이 정의되지 않았습니다.

답변

관련 문제