Javascript AngularJS:$注意选择输入_Javascript_Angularjs_Ionic Framework

Javascript AngularJS:$注意选择输入

javascript angularjs ionic-framework

Javascript AngularJS:$注意选择输入,javascript,angularjs,ionic-framework,Javascript,Angularjs,Ionic Framework,我知道我们可以使用ng change来解决这个问题，但我想了解为什么$watch在select上不起作用。也许我做错了什么，但似乎我不是唯一一个与之斗争的人。这是我的密码： HTML: 感谢…让它正常工作您需要对代码进行大量更改，您需要将所有与服务器相关的信息放在一个名为self.serverInfo的对象中，该对象将包含有关server&servers的信息。直接使用scope绑定此变量将根据JavaScript原型继承自动更新绑定 HTML <body ng-controller="

我知道我们可以使用ng change来解决这个问题，但我想了解为什么$watch在select上不起作用。也许我做错了什么，但似乎我不是唯一一个与之斗争的人。这是我的密码：

HTML:

感谢…

让它正常工作您需要对代码进行大量更改，您需要将所有与服务器相关的信息放在一个名为

self.serverInfo

的对象中，该对象将包含有关

server

servers

的信息。直接使用scope绑定此变量将根据JavaScript原型继承自动更新绑定

HTML

<body ng-controller="SettingsCtrl">
  <div class="list">
    <label class="item item-input item-select">
      <div class="input-label">
        Server
      </div>
      {{serverInfo}}
      <select ng-model="serverInfo.server" 
      ng-options="s as s.label for s in serverInfo.servers">
      </select>
    </label>
  </div>
</body>

我接受@pankajparkar的回答，但我想展示我的最终代码，因为事实上，通过@pankajparkar建议的适当绑定，我不再需要$watch了

HTML

ServerSelection服务是否应该返回一些东西，否？@curuba这是我的错，您需要在

'ServerSelection.server'

Hmm上加上手表，这不起作用。如果HTML部分只是注入控制器中，但未分配给$scope内的变量，则它似乎无法访问serverSelection服务。@curuba现在查看我更新的代码&plunkr..一切正常..我将更新答案的描述..过了一会儿，我错过了您的链接：$scope.serverSelection=serverSelection；现在它正在触发$watch，my serverSelection.server已更新，但my serverSelection.url未更新。我想我需要在我的服务中创建一个从$watch调用的方法。这就是我在chat+1Thanks@pankajpankar中试图说的

.controller('SettingsCtrl', function ($scope, $log, serverSelection) {

    //List of servers to connect to
    $scope.serverschoice = serverSelection.servers;
    $scope.server = serverSelection.server;
    $scope.$watch('server', function(NewValue, OldValue) {
        serverSelection.server = NewValue;
        $scope.url = serverSelection.url;
    }, true);

})

.service("serverSelection", function() {
    var self = this;

    self.servers = [
        { label: 'Production', value: 1, url: 'url1' },
        { label: 'Training', value: 2, url: 'url2' },
        { label: 'Local', value: 3, url: 'url2' }
    ];

    self.server = self.servers[1];
    console.log(self.server);
    self.url = self.server.url;

})

<body ng-controller="SettingsCtrl">
  <div class="list">
    <label class="item item-input item-select">
      <div class="input-label">
        Server
      </div>
      {{serverInfo}}
      <select ng-model="serverInfo.server" 
      ng-options="s as s.label for s in serverInfo.servers">
      </select>
    </label>
  </div>
</body>

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

app.controller('SettingsCtrl', function ($scope, $log, serverSelection) {

    //List of servers to connect to
    $scope.serverInfo= serverSelection.serverInfo;
    $scope.$watch('serverInfo.server', function(NewValue, OldValue) {
        $scope.url = $scope.serverInfo.server.url;
    }, true);

})

app.service("serverSelection", function() {
    var self = this;
    self.serverInfo = {};
    self.serverInfo.servers = [
        { label: 'Production', value: 1, url: 'url1' },
        { label: 'Training', value: 2, url: 'url2' },
        { label: 'Local', value: 3, url: 'url2' }
    ];

    self.serverInfo.server = self.serverInfo.servers[1];
    console.log(self.server);
    self.serverInfo.url = self.serverInfo.server.url;

})

    <div class="list">
        <label class="item item-input item-select">
            <div class="input-label">
                Serveur
            </div>
            <select ng-model="serverSelection.server" ng-options="s as s.label for s in serverSelection.servers">
            </select>
        </label>
    </div>
    <p>URL: {{serverSelection.server.url}}</p>

.controller('SettingsCtrl', function ($scope, $log, serverSelection) {

    //List of servers to connect to
    $scope.serverSelection= serverSelection;

})


.service("serverSelection", function() {
    var self = this;

    self.servers = [
        { label: 'Production', value: 1, url: 'url0' },
        { label: 'Training', value: 2, url: 'url1' },
        { label: 'Local', value: 3, url: 'url2' }
    ];

    self.server = self.servers[1];

})