2016-03-09 108 views
0

我想從一個html指令傳遞參數到控制器 示例:傳遞參數到控制器

指令:

angular.module('app') 
    .directive('helloWorld', function() { 
    return { 
     replace: false, 
     restrict: 'AE', 
     templateUrl: "./views/templates/helloWorld.html" 
    } 
}); 

的helloworld.html:

<body ng-app="app" > 
<div ng-controller="HelloWorldCtrl"> 
{{ welcome }} 
</div> 

hello.html:

<body ng-app="app"> 
<hello-world/> 
</body> 

HelloWorldCtrl:

angular.module('app') 
.controller('HomeWorldCtrl', function ($scope,) { 

    $scope.welcome = "Welcome" 

    }; 
}) 

我可以指定在hello.html的例如參數

<hello-world param="param1"/> 

這是傳遞到控制器? 那麼在HomeWorldCtrl中我可以檢查參數的值嗎? 有沒有更好的選擇來實現這一目標?

感謝,

回答

0
app.directive('helloWorld', function(){ 
return { 
    restrict:'E', 
    scope: { 
    param: '@' 
    }, 
    template:'<div class="param"><h2>{{param}}</h3></div>' 
}; 
}); 

// you have options to choose from 

//= is two-way binding 
//@ simply reads the value (one-way binding) 
//& is used to bind functions 

<hello-world="someParam"></hello-world> 
// for the scope definition: 

scope: { 
title: '@helloWorld' 
} 
The usage in the template will remain the same 

<hello-world param="someParam"></hello-world> 
+0

對不起,我不明白這一點。上面的建議是否將someParam傳遞給控制器​​? –

+0

很高興我能幫到你 –

0

如果不使用隔離範圍(範圍:{someparam: 「」}),然後你可以使用該指令模板任何$作用域屬性不改變任何東西:

$scope.param = "new param value"; 
.. 
return { 
    .. 
    ,template: "<param>{{param}}</param>" 
0

謝謝!

指令

return { 
     replace: false, 
     restrict: 'AE', 
     templateUrl: "./views/templates/PatientSearchEdit.html", 
     scope: { 
      param: '@' 
     } 
    } 

控制器

console.log($scope.param); 

日誌確實指定的值。 非常感謝!