Javascript 我可以在角材料中使用 md-select 来运行函数吗?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/29681613/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 03:47:28  来源:igfitidea点击:

Can I use md-select in angular materials to run a function?

javascriptangularjsangular-material

提问by EmptyPockets

I'm running into a strange error but maybe I am using md-select incorrectly. I am trying to go to a new page or sign out based on the ng-selected option. Unfortunately, I am receiving this error:

我遇到了一个奇怪的错误,但也许我错误地使用了 md-select。我正在尝试根据 ng-selected 选项转到新页面或注销。不幸的是,我收到此错误:

Error: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

html:

html:

<md-select placeholder="DISRUPTIVE" ng-model="activePage" ng-change="changeSelected()">
   <md-option value="settings">Settings</md-option>
   <md-option value="logout">Sign Out</md-option>
 </md-select>

controller:

控制器:

$scope.changeSelected = function(){
      switch ($scope.activePage) {
      case "settings":
        $location.path( '/account');
        break;
      case "logout":
        $scope.logout();
        break;
    }

    };

After navigating to the selected page or logging out I receive the error. Can md-select not be used this way?

导航到所选页面或注销后,我收到错误消息。不能这样使用 md-select 吗?

Edit: It's somehow related to leaving the page without letting md-select finish. If I add a $timeout it works. It's not ideal but at least I can move forward:

编辑:这与在不让 md-select 完成的情况下离开页面有关。如果我添加一个 $timeout 就可以了。这并不理想,但至少我可以继续前进:

$scope.changeSelected = function(){
      $timeout(function() {
        switch ($scope.activePage) {
        case "settings":
          $location.path( '/account');
          break;
        case "logout":
          Auth.logout();
          break;
      }
    }, 1000);

回答by Eylen

To listen to changes on the select you just need to add an ng-change directive. Check this simple example

要收听选择上的更改,您只需要添加一个 ng-change 指令。检查这个简单的例子

<div ng-app="selectDemoBasic" ng-controller="AppCtrl" layout="column" layout-align="center center" style="min-height: 300px;">
  <md-select placeholder="Pick" ng-model="someVal" ng-change="selectChanged()">
    <md-option value="1">One</md-option>
    <md-option value="2">Two</md-option>
  </md-select>
</div>

the js part

js部分

angular.module('selectDemoBasic', ['ngMaterial']).controller('AppCtrl', function($scope) {
  $scope.selectChanged = function(){
    alert("value changed-->"+$scope.someVal);
    if ($scope.someVal==1){
      $scope.otherFunction();
    }
  };

  $scope.otherFunction = function(){
    alert("in the other function");
  };
});

http://codepen.io/Eylen/pen/dobbqg/

http://codepen.io/Eylen/pen/dobbqg/