2016-07-19 3 views
1

Angular의 jQLite가 작성되지 않았기 때문에 스크립트를 템플릿 안에로드 할 수 없기 때문에 jQuery 라이브러리를 Angular jQuery의 존재 여부를 확인하고 그 결과를 확인하기 때문에 작동합니다. 그러나 내가 여기서 질문하는 것은 'but'가 있음을 의미합니다. 따라서 스크립트는 내용이로드되기 전에 실행되지 않습니다. 물론, 나는 루트로 약간의 트릭을 만들었다. 모듈의 설정 섹션에서angular - ng-view에서 ng-view 내의 스크립트를 실행 한 후에 템플릿 내용을 추가하기 전에

, 나는이 만든 :

$routeProvider 
      .when("Business/:Context/:View?", { 
       templateUrl: function (url) { 
        return "Contexts/" + url.Context + "/" + (url.View || url.Context) + ".html"; 
       } 
      }); 

는 그럼 우리가 에 경로를 설정 가정 해 봅시다 "#/비즈니스/테스트" 그는 대부분 "에 인 test.html이라는 파일을 찾습니다/컨텍스트/테스트 ", 맞아! Test.html 내용이 이것이라고 가정 해 봅시다.

<script> 
    (function(ng){  
     console.log(ng) 
     ng.module('MyApp').controller('TestController', function ($scope, $route, $routeParams, $location, $http, $mdDialog) { 
      $scope.name = "TestController"; 
      $scope.params = $routeParams; 
      $scope.name = "John"; 
     }); 
    })(angular) 
</script> 
<div ng-controller="TestController"> 
    Hola {{ name }} 
</div> 

마침내 진짜 질문 : 왜 이런 일이 발생합니까? 이 후 실행 또는 내가 모르는처럼 콘솔을 찾고 있기 때문에,이다 : 컨트롤러가 시간에 추가되지 않고

Console

각도가 존재한다. 내가 잘못하고 있니? 이 행동은 허용 되었습니까? 누구든지이 여행에서 나를 이끌 수 있습니까?

답변

0

컨트롤러 스크립트를보기에 포함하려고합니까? 왜 그 뒤에 논리가 무엇인지 이해하지 못합니까? 템플릿컨트롤러이 있는데 그 이유는 뷰/DOM과 그 뒤에있는 비즈니스 로직을 분리하는 것이기 때문입니다. 템플릿이 ngInclude, ngView, 또는 지시에 의해 사용할 수 있도록 각도에서

, $ templateCache로 요소의 script 태그 로드 내용은 그래서는 <script> 태그와 같은 interpulated하지 않습니다 정상적으로로드됩니다.

또한 요소 유형는 텍스트/NG 템플릿를 지정해야하며, 템플릿의 캐시 이름이 다음과 같이 사용할 수있는 요소의 ID를 통해 할당되어야 함을 명시 지시어의 templateUrl.

그래서 의도 한대로 스크립트 태그를 사용하지 않고 있습니다.

컨트롤러를 js 파일에 포함시키고 루트 HTML에서로드하거나 requirejs 또는 이와 유사한 라이브러리를 사용하여로드하지 않는 이유는 무엇입니까?

+0

?? 그것은 단지 아이디어였습니다. 컨트롤러와 뷰를로드하는 간단한 방법을 만들고 싶습니다. 심지어 컨트롤러 스크립트를 $ when.resolve에있는 안에로드하는 방법을 찾았을 수도 있습니다. 마지막 질문에 대한 대답은 HTML 루트에 스크립트가 많이 포함되어 있다는 것입니다. 왜냐하면 많은 컨트롤러가 필요하기 때문에 앱이 필요할 때가 아니라 처음로드 할 때로드하고 싶습니다. –

+0

@PedroMora 그렇게하면 requirejs 나 다른 라이브러리를 사용할 수 있다고 썼다. [ocLazyLoad] (https://oclazyload.readme.io/)를 체크한다. 컨트롤러가 많을 때나, 맞습니다) 필요할 때 컨트롤러를로드하려고합니다. 내 응용 프로그램에서 잘 작동하므로 시도해 볼 것을 권한다. –

+1

[튜토리얼] (https : //clazyload.readme.io/docs/with-your-router)를 [ui-router] (https://github.com/angular-ui/ui-router)와 통합하는 방법을 설명합니다. –