2014-07-12 2 views
0

master.html 파일에 header.html을 동적으로 포함하는 지시문을 만들었습니다.angularjs 지시문 범위 기능이 작동하지 않음

var app = angular.module('plunker', []); 

app.directive('header', function() { 

     var directive = {}; 
     directive.restrict = 'AE'; 
     directive.replace = true; 
     directive.scope = {}; 
     directive.templateUrl = "header.html"; 
     directive.link = function postLink($scope, $element, $attrs, $resource) { 
        $scope.version = "1.1.1.1"; 
        $scope.getusername = function() { 
       $scope.username = "pals"; 
       }; 
       }; 
     return directive; 
}); 

HEADER.html 현재를 http://plnkr.co/edit/Iau6Fu?p=preview

범위 변수 ($ scope.version)가 작동 중이 @ 작성

<div ng-init="getusername()"> 
    <p> 
    This part of the hader is always here 
    </p> 
    <p> 
    User {{username}} is logged in :D 
    </p> 
    <p> 
    {{version}} 
    </p> 
</div> 

전체 코드를 app.js.

그러나 scope function call ($ scope.getusername)이 발생하지 않습니다.

모든 조언을 주시면 감사하겠습니다. 감사.

답변

1

코드는 범위에서 getusername()이라는 메서드를 실행하기 위해 템플릿의 ngInit에 의존합니다. getusername()ngInit이 평가 된 후 실행 된 사후 링크 기능의 범위에 배치됩니다. 따라서 ngInitgetusername()을 절대로 호출하지 않습니다.

는이 문제를 해결이 ngInit 사용할 수 있도록 지침의 컨트롤러의 범위에 getusername()을 배치 ...

directive.controller = function($scope) { 
    $scope.getusername = function() { 
     $scope.username = "pals"; 
    }; 
}; 

Plunker

질문에보다는에 관련 코드를 삽입하시기 바랍니다 고비.

관련 문제