当前位置: 首页 > 面试题库 >

在angular.js中的控制器之间共享变量

昌和悦
2023-03-14
问题内容

我是angular的新手,我想知道如何在angular的控制器之间共享变量。我正在使用以下脚本-

在Main.js中:

function MainCntl($scope) {
  ---code
}

function SearchCtrl($scope, $http) {
    $scope.url = 'http://10.0.0.13:9000/processAdHoc';
    $scope.errorM = "No results";     
    $scope.search = function() {

        $http.post($scope.url, { "data" : $scope.keywords}).
        success(function(data, status) {
            $scope.status = status;
            $scope.data = data;
            $scope.result = data; 
            alert('yes');
        })
        .
        error(function(data, status) {
            $scope.data = data || "Request failed";
            $scope.status = status;   
            alert('no');
            $scope.result = "failed";
        });
    };
}

在Index.html中

<body ng-controller="MainCntl" >
---code
<div ng-controller="SearchCtrl">
     <form class="well form-search">
     <div class="ui-widget">
          <label for="tags"></label>
          <a ng-click="search()"><input type="image" src="../../images/search1.png" class="searchbox_submit" /></a>
          <input ng-model="keywords" placeholder="Shadow Search" id="tags" class="input-medium search-query rounded" /> 
     </div>
     </form>
</div>
---code
<p ng-model="result">
     {{result}}
</p>
</body>

我正在发送数据并接收响应的ajax一切正常,我的问题如下:

在SearchCtrl函数中,我有一个名为$
scope.result的变量,稍后在Index.html中进行引用。如果我将包含该变量的html代码插入SearchCtrl控制器,则可以正常工作,但如果位于MainCtrl控制器中,则无法正常工作。如何在控制器之间共享此变量。

提前谢谢


问题答案:

使用服务并将其注入到两个控制器中,然后将范围变量引用到services变量。

例:

angular.module("yourAppName", []).factory("myService", function(){

  return {sharedObject: {data: null } }

});

function MainCtrl($scope, myService) {
  $scope.myVar = myService.sharedObject;
}

function SearchCtrl($scope, $http, myService) {
  $scope.myVar = myService.sharedObject;
}

在您的模板中执行以下操作:

{{myVar.data}}

[See an example](http://jsbin.com/ABUpOXA/1) 使用Angular v1.1.5

将其放在内部对象中的原因是为了保留引用,如果保留它不带“ sharedObject”,然后更改该对象,则绑定将指向旧引用,并且模板中不会显示任何内容。



 类似资料:
  • 问题内容: 我有一项从服务器中获取一些客户端数据的服务: 然后在一个控制器中执行: 一切都很好。但是,我正在尝试从该服务上的另一个控制器进行监视,以在数据更改时更新其范围,而不是必须重新启动http请求: 我现在只是提醒,但从未触发过。页面最初加载时,它会发出“未定义”警报。我在控制台中没有任何错误,并且所有$ injects都很好,但是似乎从未意识到服务中的数据已更改。我在手表上做错了吗? 非常

  • 问题内容: 我正在尝试在控制器之间共享数据。用例是一个多步骤的表单,在一个输入中输入的数据以后会在原始控制器之外的多个显示位置中使用。下面和jsfiddle中的代码。 的HTML JS 任何帮助是极大的赞赏。 问题答案: 一个简单的解决方案是让您的工厂返回一个对象,并让您的控制器使用对同一对象的引用: JS: HTML: 演示: http : //jsfiddle.net/HEdJF/ 当应用程序

  • 问题内容: 我正在阅读有关Angular验证的文章,并认为在我自己的项目中使用它会很好。它运行得非常好,我想在成功验证表单后在其他控制器中扩展它的访问方法。我尝试了各种方法来执行此操作,但似乎看不到$ scope对象中的方法。 我希望有人能告诉我我想念的东西才能完成这项工作。我叉了个笨蛋。 问题答案: 正确的方法是使用角度服务。例如: 这样,您可以在注入到的任何控制器中访问内部功能: 看到这个演示

  • 我想使用@SessionAttributes注释在SpringMVC中的两个控制器之间共享会话属性。 下面是我用来测试属性共享的一个简单代码:AController。JAVA a.jsp BController.java b.jsp 我期望的行为是转到 /aURL,myParam将被设置为0到99之间的随机值,然后该值将在两个控制器之间共享。 但是,会发生以下情况:我转到/a URL,myPara

  • 问题内容: 我正在尝试在控制器之间共享数据。用例是一个多步骤的表单,在一个输入中输入的数据以后会在原始控制器之外的多个显示位置中使用。下面和jsfiddle中的代码。 HTML JS 问题答案: 一个简单的解决方案是让您的工厂返回一个对象,并让您的控制器使用对同一对象的引用: JS: HTML: 当应用程序变得更大,更复杂且难以测试时,您可能不希望以这种方式从工厂公开整个对象,而是例如通过gett

  • 我在Spring控制器的2个webservice中使用了相同的ArrayList,所以我想使用请求或会话范围从DB中获取一次,我尝试制作一个bean } 在控制器中 application context CTX = new AnnotationConfigApplicationContext(example bean。类);AttendeesBean attendee bean = CTX .