AngularJs傳遞參數值到控制器

我的HTML：AngularJs傳遞參數值到控制器

<test-app email="[email protected]"></test-app>

我的指令：

.directive('testApp', function() { 
return { 
    restrict: 'E', 
    scope: { 
     userEmail = '@userEmail' 
    }, 
    templateUrl: 'Form.html' 
}; 
})

我在另一個頁面表單：

<label> Email </label> 
<input type="text" id="email">

問題：我需要得到的參數值，並在文本框本身上打印出來。

我做了什麼：我研究了很多文章，論述瞭如何將指令參數傳遞給控制器，但它們非常複雜。

我認爲是下一個步驟：

1）通指令參數到控制器，然後綁定控制器到文本框，並設置文本框的值設定爲參數值。

2）或者有另一種方法可以做到這一點？

我被困在如何繼續。

來源

2017-01-09 John Tan

首先嚐試按照指令命名convension（** **駝峯），例如：指令名'makeBold'然後用它模板如：'' –

@AvneshShakya編輯。但這不會幫助開始。任何提示繼續？ –

你想要'電子郵件'值在指令中，是否正確？所以試試這個：範圍：{userEmail：'@email'}，'在你的模板中：''詳細檢查隔離範圍[這裏]（https://jsfiddle.net/avnesh2/fzyo5p0t/?utm_source=website&utm_medium=embed&utm_campaign=fzyo5p0t） –

您可以使用使用@

屬性字符串結合在控制器你初始化userEmail變量
的指令有它加載值到指令的userEmail一個user-email屬性局部範圍變量。
使用userEmail:'@'允許從控制器到指令的字符串綁定。

請參見下面的演示：

angular.module("app",[]).directive('application', function() { 
 
    return { 
 
    restrict: 'E', 
 
    scope: { 
 
     userEmail : '@' 
 
    }, 
 
    templateUrl: 'Form.html' 
 
    }; 
 
}).controller("ctrl",function($scope){ 
 
    $scope.userEmail="[email protected]"; 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="app" ng-controller="ctrl"> 
 
    <application user-email="{{userEmail}}"></application> 
 
    <script type="text/ng-template" id="Form.html"> 
 
    <label>Email</label> 
 
    <input type="text" id="email" ng-model="userEmail"> 
 
    </script> 
 
</div>

來源

2017-01-09 16:13:46 kukkuz

你的答案是有點接近。但是我希望用戶可以直接輸入的指令中的值例如：。我想'test @ hotmail。com'被插入到表單的文本框 –

@JohnTan好吧，我不確定你在找什麼，你可以使用''？ – kukkuz

@JohnTan只是跟進這個 - 所以你設法解決這個問題？如果這個答案有幫助，upvote /也接受，謝謝！ – kukkuz

AngularJs傳遞參數值到控制器

回答

相關問題