부분보기의 angularjs 컨트롤러 스크립트가 작동하지 않습니다.

<ng-view> 지시어로 부분보기를 시도했습니다. 부분보기 파일에서 부분보기에 다른 컨트롤러를 사용했지만 콘솔에서 오류를 표시하지 않습니다.부분보기의 angularjs 컨트롤러 스크립트가 작동하지 않습니다.

아래 코드

index.html을

<!DOCTYPE html> 
<html> 

    <head> 
    <link data-require="[email protected]" data-semver="3.3.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.css" /> 
    <script data-require="[email protected].8" data-semver="1.5.8" src="https://code.angularjs.org/1.5.8/angular.js"></script> 
    <script data-require="[email protected]" data-semver="1.5.8" src="https://code.angularjs.org/1.5.8/angular-route.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script> 
var testApp = angular.module("testApp", ["ngRoute"]).config(function ($routeProvider) { 
$routeProvider.when("/table", { 
templateUrl: "tab1.html" 
}); 
$routeProvider.when("/tab2", { 
templateUrl: "tab2.html" 
}); 
$routeProvider.when("/tab3", { 
templateUrl: "tab3.html" 
}); 
$routeProvider.when("/tab4", { 
templateUrl: "tab4.html" 
}); 
$routeProvider.otherwise({ 
templateUrl: "tab1.html" 
}); 
}); 

testApp.controller('testCtl',function($scope,$location){ 


$scope.check = function(selectedView){ 
    return selectedView == $location.path(); 
} 
}); 
</script> 
    </head> 

<body ng-app="testApp" ng-controller="testCtl"> 
       <ul class="nav nav-tabs" style="margin-bottom: 15px;"> 
        <li role="presentation" ng-class="{ active: check('/tab1')}"><a href="#/tab1">Tab ONE</a></li> 
        <li role="presentation" ng-class="{ active: check('/tab2')}"><a href="#/tab2">Tab TWO</a></li> 
        <li role="presentation" ng-class="{ active: check('/tab3')}"><a href="#/tab3">Tab THREE</a></li> 
        <li role="presentation" ng-class="{ active: check('/tab4')}"><a href="#/tab4">Tab FOUR</a></li> 
       </ul> 
<ng-view> 
</body> 

</html>

tab1.html 메타 대신 내가 콘솔에 오류가 점점 오전 바인더 제본되지

<script> 
    angular.module("testApp").controller('tabOneCtl',function($scope){ 
    $scope.meta = "something"; 
    }); 
</script> 
<div ng-controller="tabOneCtl"> 
    This is tab one and this tab has meta values which are shown below 
    {{meta}} 
</div>

입니다.

Error: [ng:areq] Argument 'tabOneCtl' is not a function, 
got undefinedhttp://errors.angularjs.org/1.5.8/ng/ 
areq?p0=tabOneCtl&p1=not%20a%20function%2C%20got%20undefined

내가 뭘 잘못하고 있니? 여기

는 plunker

출처

2016-10-17 rram

이것은 지연로드라고합니다. 템플릿에 스크립트를 포함시키는 것만으로는 그 작업을 수행 할 수 없습니다. "게으른 로딩"을 찾으십시오. – Ronnie

시도가 초기 페이지에 컨트롤러를 추가로 연결되는 링크입니다. 부분 뷰를 렌더링 할 때 스크립트 태그가 컨트롤러가 각도로 인스턴스화 될 때가 지 시간에 맞게 실행될 것이라고 나는 믿지 않습니다. 나는 그것에 대해 100 % 확신하지는 않지만. 부분 뷰의 스크립트 태그에 컨트롤러가있는 것이 가장 좋은 방법이라고 생각하지 않습니다.

또한 외부 JavaScript 파일에 각진 응용 프로그램 코드가 있으면 축소와 같은 작업을 읽고 실행할 수 있습니다.

희망이 있습니다.

출처

2016-10-17 20:47:30 mchaffe

도움을 주셔서 감사합니다. 나는 의심 스럽다. 우리가 (사용자가 그 부분을 보지 않는다면) 재생되지 않을 수도있는 뷰를위한 스크립트를 놓으면 스크립트 파일과 그로드가 아무 쓸모가 없다고 생각하지 마십시오. 그래서 필자는 스크립트를 동일한 파일에 두어 클라이언트에 필요한 파일 만 제공하고 추가로드를 피하려고했습니다. – rram

부분보기의 angularjs 컨트롤러 스크립트가 작동하지 않습니다.

답변

관련 문제