Javascript 如何从控制器内的javascript函数调用角度范围函数

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/37594769/
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 20:30:08  来源:igfitidea点击:

how to call angular scope function from javascript function inside controller

javascriptangularjsangularjs-directive

提问by Mohamed Sahir

I have angular controller and Javascript function in that function , i am calling angular function. I am getting error: $scope.Name is not a function, $scope.dates is not a function.

我在该函数中有 angular 控制器和 Javascript 函数,我正在调用 angular 函数。我收到错误:$scope.Name 不是函数,$scope.dates 不是函数。

     function validation() {
            $scope.pageload = true;

            $scope.Name();
            $scope.dates();  
        }

        $scope.Name = function () {
           // do something
        }

        $scope.dates = function () {
          // do something       
        }

working fine inside the controller

在控制器内部工作正常

    var MyController = function ($scope, service)
    {


       function validation() {

            $scope.pageload = true;

            $scope.Name();
         $scope.dates();

        }

       $scope.Name = function () {


            // do something
        }

     $scope.dates = function () {

            // do something

    }


});


working:


var MyController = function ($scope, service)
{
 LoginHomeService.getHomeService(function (data) {
                $rootScope.CT1SessionObj = data.CT1SessionObj;

                        validation();



                                    }, function (response) {
                                        alert(response.Message);
                                    });

   function validation() {

        $scope.pageload = true;

        $scope.Name();
     $scope.dates();

    }

   $scope.Name = function () {


        // do something
    }

 $scope.dates = function () {

        // do something




});




Not working:

    var MyController = function ($scope, service)
    {
     LoginHomeService.getHomeService(function (data) {
                    $rootScope.CT1SessionObj = data.CT1SessionObj;

                            validation();


   function validation() {

        $scope.pageload = true;

         $scope.Name();
         $scope.dates();

        }

       $scope.Name = function () {


            // do something
        }

     $scope.dates = function () {

            // do something

    }


   }, function (response) {
    alert(response.Message);
   });


   });

回答by Matheno

Declare $scope.Nameand $scope.dateson top of validation()

声明$scope.Name$scope.datesvalidation()

Javascript works from top to bottom, so your functions $scope.Nameand $scope.Datesdo not exist 'yet'.

JavaScript的从上到下的作品,所以你的功能$scope.Name$scope.Dates不存在“又”。

Also, try not to use 'Name' as a function. Most of these words are reserved keywords.

另外,尽量不要将“名称”用作函数。这些词大多是保留关键字。

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

//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});

function MyCtrl($scope) {

    $scope.Name = function() {
    // do something
  }

  $scope.dates = function() {
    // do something       
  }

  function validation() {
    $scope.pageload = true;

    $scope.Name();
    $scope.dates();
  }
}

Fiddle: http://jsfiddle.net/Lvc0u55v/4872/

小提琴:http: //jsfiddle.net/Lvc0u55v/4872/

An even better approach would be the 'John Papa style' : Y033

更好的方法是“约翰爸爸风格”:Y033

Place bindable members at the top of the controller, alphabetized, and not spread through the controller code.

Why?: Placing bindable members at the top makes it easy to read and helps you instantly identify which members of the controller can be bound and used in the View.

Why?: Setting anonymous functions in-line can be easy, but when those functions are more than 1 line of code they can reduce the readability. Defining the functions below the bindable members (the functions will be hoisted) moves the implementation details down, keeps the bindable members up top, and makes it easier to read.

将可绑定成员放在控制器的顶部,按字母顺序排列,而不是通过控制器代码展开。

为什么?:将可绑定成员放在顶部便于阅读,并帮助您立即确定控制器的哪些成员可以在视图中绑定和使用。

为什么?:在线设置匿名函数很容易,但是当这些函数超过 1 行代码时,它们会降低可读性。定义可绑定成员下方的函数(函数将被提升)将实现细节向下移动,将可绑定成员保持在顶部,并使其更易于阅读。

/* avoid */
function SessionsController() {
    var vm = this;

    vm.gotoSession = function() {
      /* ... */
    };
    vm.refresh = function() {
      /* ... */
    };
    vm.search = function() {
      /* ... */
    };
    vm.sessions = [];
    vm.title = 'Sessions';
}


/* recommended */
function SessionsController() {
    var vm = this;

    vm.gotoSession = gotoSession;
    vm.refresh = refresh;
    vm.search = search;
    vm.sessions = [];
    vm.title = 'Sessions';

    ////////////

    function gotoSession() {
      /* */
    }

    function refresh() {
      /* */
    }

    function search() {
      /* */
    }
}

回答by Siddappa Walake

As @Harald Wiesinger mentioned declare called functions prior to calling function.

正如@Harald Wiesinger 提到的,在调用函数之前声明被调用的函数。

回答by Harald Wiesinger

Put validation after the scope functions

将验证放在范围函数之后

$scope.Name = function () {
   // do something
}

$scope.dates = function () {
  // do something       
}

function validation() {
    $scope.pageload = true;

    $scope.Name();
    $scope.dates();  
}