0

是否可以将 aninput的值绑定到 another 的值input？以下不起作用：

<input ng-model="val">
<input value="Hello {{val}}">
4

3 回答 3

2

这是简单的解决方案：http ://plnkr.co/edit/7HxnM3O1UE1RxCCPvvJ0?p=preview

应用程序.js

app.controller('MainCtrl', function($scope) {
    $scope.formatText = function() {
        return "Hello " + $scope.text;
    };

    $scope.$watch('text', function(newValue) {
        $scope.formatedText = "Hello "+ (newValue ? newValue : "");
    })
});

索引.html

<body ng-controller="MainCtrl">
    <input type="text" ng-model="text"/>
    <input type="text" ng-model="formatedText"/>
</body>

对于更常见的方式，您可以将 $scope.$eval 与您自己的指令一起使用。

于 2013-11-04T10:43:43.540 回答
1

对于您发布的简单用例，您可以使用点表示法。

小提琴示例

<input ng-model="new.val">
<input value="Hello {{new.val}}">

通过使用 dot.notation，您可以避免与范围问题发生冲突以及与全局命名空间发生冲突。不知道所涉及的所有变量可能是问题所在。

任何 $scope.val 都会干扰。

<input ng-model="val">
<input value="Hello {{val}}">

通过使用点符号和深度链接，您可以避免很多常见问题。

于 2013-11-04T10:30:18.370 回答
0

是的。这是一个使用您的代码的工作插件。

js：

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


myApp.controller('Ctrl', function($scope) {

  $scope.val = 'Guy';

  });

html:

<!DOCTYPE html>
<html ng-app="myApp">

  <head>
    <script data-require="angular.js@*" data-semver="1.2.0-rc3-nonmin" src="http://code.angularjs.org/1.2.0-rc.3/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="Ctrl">
    <h1>Hello Plunker!</h1>

    <input ng-model="val">
    <input value="Hello {{val}}">
  </body>

</html>

val*注意：除非你想初始化它的值，否则你不需要添加到控制器中。

于 2013-11-04T10:24:22.007 回答