绑定到TextBox的值不可见

时间:2014-11-13 22:00:25

标签: jquery angularjs

我使用JQuery将ng-bind属性设置为Textbox,以便从Angular Controller显示模型值。模型的值绑定到选择框,因此当它更改时,我应该看到文本框中的更改。

当更改选择框时,没有任何显示,但我可以看到使用F12 Developer Tools填充的value属性。

为什么我在文本框中看不到值? Plunkr Here

  <div ng-controller="ExampleController">

    <p>This Simulates a Existing Input Box:
      <br/>
      <input id="originalSPTexbox" type="text" />
    </p>

    <hr/>

    <p>
      This dropdown contains project names found in search results.

    </p>
    <select ng-model="value" ng-change='ProjectSelected(value.RefinableString00)' ng-options="p.RefinableString00 for p in SearchResults track by p.RefinableString00">
      <option>-- Project --</option>
    </select>


    <p>
      This input box simply outputs the selected project:
      <br/>
      <input id="txt_Projects" style="width:95%" type="text" value='{{SelectedProj}}' />
    </p>

  </div>

  <script>
    $('body').attr('ng-app', 'changeExample');
    $('#originalSPTexbox').attr('ng-bind', 'SelectedProj')
     var data = '{<<json blob>>}';

    angular.module('changeExample', [])
      .controller('ExampleController', ['$scope',
        function($scope) {
          var rawData = JSON.parse(data); // web  service call
          $scope.SearchResults = rawData.ResultRows;
          $scope.SelectedProj="Default Value";

          $scope.ProjectSelected = function(proj) {
            $scope.SelectedProj = proj;
            //$('input#originalSPTexbox').val(proj);
          };

        }
      ]);
  </script>

1 个答案:

答案 0 :(得分:0)

我更新了绑定。我没有通过jquery添加ng-bind属性,而是添加了

$('#originalSPTexbox').attr('value', '{{SelectedProj}}').  

New working Plunker here