在 angularjs 中调整非标准属性

Question

我有一个使用 GWT 2.7 从 java 编译为 java 脚本的现有模型。此模型中的每个属性都有一个 getValue() 和一个 setValue() 方法。方法名称未损坏。

我想在 {{}} 表达式中使用这些属性，专门用于使用 ngModel 进行绑定。我在 $scope 中使用 "getterSetter" 选项和一个函数，该函数将 getValue()/setValue() 包装在 angularJS getterSetter 函数中。

问题是我不想在每个范围内重复这个函数。有什么方法可以访问 angularJS 表达式中的全局函数？

Answer 1

来自文档：

Angular expressions do not have access to global variables like window, document or location. This restriction is intentional. It prevents accidental access to the global state – a common source of subtle bugs.

你能把函数附加到模型原型上吗？这样你就可以在任何有模型实例的地方访问它。

或者，您可以创建一个包装器 class（基本上是一个视图模型），它具有您需要的接口，并委托给真实的模型实例。

Answer 2

经过相当多的搜索和试验，我发现我可以使用 directive 的 controller 将函数添加到 scope。

.directive('wrapped', function() {
    return {
        controller: function($scope) {
            $scope.wrapper = function(prop) {
                // turns signal into getterSetter
                return function(newVal) {
                    if (angular.isDefined(newVal)) {
                        prop.setValue(newVal);
                        }
                    return prop.getValue();
                    }
                }
            },
        scope : {
            model : '&'
            },
        templateUrl : 'template.html',
    }
})

然后可以在模板中的表达式中使用作用域中的函数。

<p class="field {{model().status().isValid() ? 'valid' : 'invalid'}}">
    <span class="label">{{label}}:</span>
    <input type="text" ng-model="wrap(model())" ng-model-options="{getterSetter: true}" ></input>
</p>

如果有更惯用的写法，我很乐意听取更有经验的 AngularJS 程序员的意见。

在 angularjs 中调整非标准属性

Adapting non-standard properties in angularjs

javascript

gwt

angularjs