2016-10-21 3 views
0

Мне нужно получить доступ к значению из контроллера директивы внутри моего контроллера.

<div ng-controller="myCtrl"> 
     <my-directive atr="xyz"></my-directive> 
    </div> 

// вот моя директива

app.directive('myDirective',function() { 
return { 
restrict : 'E', 
replace : false, 
scope :{ 
atr :'@' 
}, 
controller : function($scope) { 
    console.log($scope.atr); //xyz 
$scope.keyPoint ="this is what i want to access inside myCtrl"; 
} 
} 

}); 

// здесь Ctrl

app.controller('myCtrl',function($scope){ 
//how can i access keyPoint here 
}) 

ответ

1

Разделительный область применения:

Вы должны использовать two-way обязательными для характерной точки достигать это.

scope :{ 
    atr :'@', 
    keyPoint: '=' 
    }, 

Что это будет сделать, это когда-либо изменить значение в директиве, она отражает в вашем контроллере, и наоборот

// Instantiate the app, the 'myApp' parameter must 
 
// match what is in ng-app 
 
var myApp = angular.module('myApp', []); 
 

 
// Create the controller, the 'ToddlerCtrl' parameter 
 
// must match an ng-controller directive 
 
myApp.directive('myDirective',function() { 
 
    return { 
 
     restrict : 'E', 
 
     replace : false, 
 
     scope :{ 
 
     atr :'@', 
 
     keyPoint: '=' 
 
     }, 
 
     controller : function($scope) { 
 
     console.log($scope.atr); //xyz 
 
     $scope.keyPoint ="this is what i want to access inside myCtrl"; 
 
     } 
 
    } 
 

 
}); 
 

 
myApp.controller('myCtrl',function($scope,$timeout){ 
 
    $timeout(function(){ 
 
\t \t \t \t alert($scope.keypoint) 
 
\t \t \t },500) 
 
    
 
})
<!DOCTYPE html> 
 
<html ng-app="myApp"> 
 

 
    <head> 
 
    <script data-require="[email protected]" data-semver="1.2.7" src="http://code.angularjs.org/1.2.7/angular.js"></script> 
 
    <link href="style.css" rel="stylesheet" /> 
 
    <script src="script.js"></script> 
 
    </head> 
 
    <body> 
 
    <h1>Starter AngularJS app</h1> 
 
     <div ng-controller="myCtrl"> 
 
      <my-directive atr="xyz" key-point="keypoint"></my-directive> 
 
     </div> 
 
    {{keypoint}} 
 
    </body> 
 

 
</html>

Пожалуйста, запустите этот фрагмент

Here is the fiddle

без выделения сферы:

Если вы хотите, чтобы получить объем контроллера в директиве, то не изолируйте область в директиве. Если вы изолируете область действия, вы не можете получить область управления.

// Instantiate the app, the 'myApp' parameter must 
 
// match what is in ng-app 
 
var myApp = angular.module('myApp', []); 
 

 
// Create the controller, the 'ToddlerCtrl' parameter 
 
// must match an ng-controller directive 
 
myApp.directive('myDirective',function() { 
 
    return { 
 
     restrict : 'E', 
 
     replace : false, 
 
     controller : function($scope) { 
 
     console.log($scope.atr); //xyz 
 
     $scope.keyPoint ="this is what i want to access inside myCtrl"; 
 
     } 
 
    } 
 

 
}); 
 

 
myApp.controller('myCtrl',function($scope,$timeout){ 
 
    $scope.atr="xyz" 
 
    $timeout(function(){ 
 
\t alert($scope.keyPoint) 
 
    $scope.$apply(); 
 
},500) 
 
    
 
})
<script data-require="[email protected]" data-semver="1.2.7" src="http://code.angularjs.org/1.2.7/angular.js"></script> 
 
    <link href="style.css" rel="stylesheet" /> 
 
    <script src="script.js"></script> 
 
    <body ng-app="myApp"> 
 
    <h1>Starter AngularJS app</h1> 
 
     <div ng-controller="myCtrl"> 
 
      <my-directive ></my-directive> 
 
     <h1>{{keyPoint}}</h1> 
 
     </div> 
 
    
 
    </body>

Fiddle for second snippet

+0

@unknown, пожалуйста, запустите сниппет и проверьте. – Sravan

+0

Я не хочу передавать ключевой момент в качестве атташе. Я просто хочу использовать ключевую точку внутри моего основного контроллера. – unknown

+0

в контроллере моей директивы Я получаю объект в качестве ответа на вызов отдыха. Так что я хочу использовать этот объект внутри моего основного контроллера. – unknown

Смежные вопросы