來自rootScope的角ng模型輸入
[英]Angular ng-model Input from rootScope
問題描述
我只是遇到了一個簡單的問題。 我有一個帶有占位符“用戶名”的輸入字段。 如果選擇了一個User並因此在$ rootScope中可用，則顯示ng-model。
到目前為止工作正常...
input type="text" placeholder="Username..." ng-model="user.name + user.id"/>
視圖中的當前輸出：
Username12
我想成為的輸出是：
Username (12)
有誰知道如何實現這一目標？
提前致謝！
2 個解決方案
解決方案1
2 已采納 2016-02-26 13:19:08
由於您可能想對<input>元素的值做一些事情（否則使用另一種只讀方法），因此ng-model應該代表一個簡單的變量名（不進行計算/串聯）。
為此，您應該使用$watch('user', ...每次user對象更改時生成更新的<input>值。
HTML
<body ng-controller="MainCtrl">
<input type="text" placeholder="Username..." ng-model="userInput" />
</body>
JavaScript的
app.controller('MainCtrl', function($scope) {
$scope.user = {
name: "Marc",
id: 1
};
$scope.userInput = '';
// ...
$scope.$watch('user', function(user){
$scope.userInput = user.name + ' (' + user.id + ')';
});
});
在線演示
https://plnkr.co/edit/DqjFIiiU8EJmHWUhJdGl?p=preview
解決方案2
0 2016-02-26 13:01:56
如果要進行數據綁定，請使用ng-model。
在這里看起來您只想打印（而不是更新）這些值。
然后，我建議只使用帶有打印的簡單html標簽，而不是將數據（以錯誤的方式）包裝在輸入中。
例如，您可以對任何html元素執行類似普通綁定的操作：
<span ng-bind="user.name"></span>(<span ng-bind="user.id"></span>)
在具有從另一個模型角度設置值的輸入字段上使用ng-model
[英]Use ng-model on Input Field that Has Value Set From Another Model Angular
如何將ng-model從Angular 1.6 Component傳遞給input元素
[英]How to pass ng-model from Angular 1.6 Component to input element
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.
相關問題
Angular JS如何將值從rootcope傳遞到ng-model？
預定義的輸入並在Angular中傳遞給ng-model
在ng-model中連接$ rootScope和字符串
Angular ng-model 未綁定到輸入字段
從Angular服務更新ng-model
在具有從另一個模型角度設置值的輸入字段上使用ng-model
Angular - 綁定到ng-repeat的ng-model復選框
ng-options過濾器等於來自輸入的ng-model
從嵌套ng-repeat綁定的角ng模型
如何將ng-model從Angular 1.6 Component傳遞給input元素
相關標簽