1

这是我的情况：我已经创建的应用程序中有一个 Javascript 对象，看起来有点像这样......

var foo = foo || {};
foo.name = "";
foo.gender = "";

foo.loadUser = function() {
    // Some other stuff here
    foo.name = "Joe";
    foo.gender = "Fella";

    $("#welcome).text("Hello " + foo.name + " you sure are a swell " + foo.gender + "!");    
}

现在，我决定我不喜欢逻辑和表示的混合，所以我想删除 jquery 的那一行，并让 angular.js 用一些简单的数据绑定为我更新文本。所以我已经加载了 angular.js 并添加了这条小线..

<div ng-app>
<div id="welcome" ng-controller="foo">Hello {{foo.name}}! 
     You sure are a swell {{foo.gender}}!</div>

问题是，在执行此操作时，我得到一个错误...

错误：参数 'foo' 不是函数，得到了对象

查看 angular.js Getting Started 示例，看起来我可能需要返回并以如下格式重写我的整个 foo 对象（以及我的所有其他代码）...

function foo($scope) {
  $scope.name = '';
  $scope.gender = '';

  $scope.loadUser = function() {
    //Other stuff here
    $scope.name = "Joe";
    $scope.gender = "Fella"            
  }

}

...这可能有效（我还没有尝试过），但我不确定我是否要重写我的所有代码以适应这种新格式。我有比 foo 更多的对象，而在现实生活中 foo 有更多的东西。（见鬼，我什至不叫它“foo”！）

有什么方法可以让数据绑定工作而无需将所有对象都重写为函数？

4

2 回答 2

4

不确定这是否是您要查找的内容，但您仍然应该能够使用 foo 对象，因为它们位于 Angular 控制器中，如下所示：

function Controller($scope){
    $scope.foo = foo;
    foo.loadUser();
}

有关示例，请参见此小提琴。您可能还想将您的对象移动到本文第 2 课中所述的服务或工厂中。

于 2012-08-04T06:26:17.363 回答
0

这可能看起来很明显，但你有没有尝试过ng-controller="foo.loadUser"

标记

<div id="welcome" ng-controller="foo.loadUser">Hello {{foo.name}}! 
     You sure are a swell {{foo.gender}}!</div>

有角度的

foo.loadUser = function($scope) {
    // Some other stuff here
    foo.name = "Joe";
    foo.gender = "Fella";

    $scope.foo = foo;
}

只要该函数作为 $scope 接收并对该值执行所有 angularjs 魔术，您就不必更改现有对象。

于 2012-08-09T20:56:23.037 回答