Question

我需要语法帮助。

我尝试创建2个存储为变量的用户输入，这些输入将在3个独立的控制器中使用。

我要做的是创建一个表，其中每一行本身就是一个控制器。根据用户输入的数字，每行将计算各种字段。

＆＃39;标准眼睛水平＆＃39;和ImageAspectRatio＆＃39;需要进入三个控制器中的每一个，但我不确定正确的语法是什么。

请看看我的plunkr：https://plnkr.co/edit/ptHhwmaKdeB4CfYEvdlL?p=preview

var BDMApp = angular.module('BDMApp', []);
var StandardEyeLevel = Number(ctrl.StandardEyeLevel || 0);
var ImageAspectRatio = Number(ctrl.ImageAspecRatio || 0);

BDMApp.controller('BDMFarViewController', [function() {
var ctrl = this;
ctrl.BDMCalc = function() {
  var BDMFarViewImgHeight = Number(ctrl.BDMFarViewImgHeight || 0);
  var BDMFarViewDistFloor = Number(ctrl.BDMFarViewDistFloor || 0);
  var BDMFarViewMinPerElm = Number(ctrl.BDMFarViewMinPerElm || 0);
  ctrl.BDMFarViewImgOffSetAns = BDMFarViewDistFloor - StandardEyeLevel;
  ctrl.BDMFarViewImgWidthAns = BDMFarViewImgHeight * ImageAspectRatio;
  ctrl.BDMFarViewFarViewAns = BDMFarViewDistFloor * BDMFarViewMinPerElm * 200;
  ctrl.BDMFarViewViewRatAns = ctrl.BDMFarViewFarViewAns / BDMFarViewDistFloor;
  ctrl.BDMFarViewVVFAns = BDMFarViewDistFloor + ctrl.BDMFarViewImgOffSetAns;
  ctrl.BDMFarViewCloseViewAns = ctrl.BDMFarViewVVFAns * 1.732;
  ctrl.BDMFarViewViewRatAns = ctrl.BDMFarViewCloseViewAns / BDMFarViewImgHeight;
  ctrl.BDMFarviewNominalViewDepthAns = ctrl.BDMFarViewFarViewAns - ctrl.BDMFarViewCloseViewAns;
}
}]);

感谢任何和所有帮助。

Answer 1

如果您想在控制器之间共享数据，则应在服务中编写可共享代码。

<强> myService.js

app.service('myService', [function(){
        var self = this;
        self.img;
        self.img.StandardEyeLevel;
        self.img.ImageAspectRatio;
        self.getValues = function(passedVal){
           self.img[any one of the img property] = passedVal;
           return self.img;
        }

        return {
           'getValues': self.getValues
        }
}])

现在，在控制器中注入服务并调用函数，并设置值以从不同的控制器升级它。

app.controller('myCtrl', ['$scope', 'myService', function($scope, myService){
   $scope.StandardEyeLevel = myService.getValues();
}])

这不是一个好习惯，只是说理解控制器如何与服务共享数据的目的。

注意：使用您的plunker代码替换下面的代码。观察控制台和输出

<head>
   <title>Share data between controllers in AngularJs with $rootScope</title>
   <link rel="stylesheet" href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css">
   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.js"></script>
   <script>
      var app = angular.module("myApp", []);
      app.run(function($rootScope) {
         $rootScope.userData = {};
         $rootScope.userData.firstName = "";
         $rootScope.userData.lastName = "";
      });
      app.controller("firstController", ["myService", "$scope", "$rootScope", function(myService, $scope, $rootScope) {
        $scope.userData.firstName = myService.getVal("Hello", '');
        console.log('aaaaaaaaaa', $scope.userData.firstName)
      }]);
      app.controller("secondController", ["myService", "$scope", "$rootScope", function(myService, $scope, $rootScope) {
        $scope.userData.lastName = myService.getVal('', "World");
        console.log('aaaaaaaaaa', $scope.userData.lastName)
      }]);
      app.service('myService', function(){
        var self = this;
        self.names = {};
        self.getVal = function(fname, lname){
          if(fname){
           self.names.fname = fname;
          }
          if(lname){
           self.names.lname = lname;
          }
         return self.names;
        }
        return self;
      })
   </script>
</head>

<body ng-app="myApp">
   <div ng-controller="firstController">
      <br>
      <input type="text" ng-model="userData.firstName.fname">
      <br>
      <input type="text" ng-model="userData.lastName.lname">
   <hr>
   </div>
   <div ng-controller="secondController"> Username: <b> {{userData.firstName.fname}}</b>
   <br>
   Lastname:<b>{{userData.lastName.lname}}</b>      </div>
</body>

</html>

Answer 2

或者，您也可以使用return { ...state, taggable_friends: [...state.taggable_friends, action.payload], }在控制器之间共享数据

脚本代码

$rootScope

以下是参考的link。

Answer 3

您应该将它们声明为全局变量，如下所述。

var myApp = angular.module('app', ['onsen']);
var Global_User = null;
var Global_Token = null;
var Global_IsLoggedIn = false;

myApp.controller('LoginController', function ($scope, $http, DatabaseService) {
    $scope.login = function (Username, Password) {
        $http.get(BaseServiceURL + "api/Token/GetToken?UserName=" + Username + "&Password=" + Password + "")
       .success(function (data) {
            DatabaseService.session.setItem('userName', Global_User);
            DatabaseService.session.setItem('token', Global_Token);
            LoginNavigator.pushPage('Home.html');
        }
    }
});

myApp.controller('HomeController', function ($scope, $http) {
    if (Global_IsLoggedIn == true) {
        $scope.greeting = "Hi " + nameCase(Global_User);
    }
});

AngularJs - 如何创建一个将在多个控制器中使用的变量/一个输入？

3 个答案: