从指令中的范围对象复制值

Question

我有一个指令，我在读取值作为属性并将它们存储在范围内。我的标记如下：

<my-directive
        ng-model="myCtrl.widgets"
        widget-amount="myCtrl.widgets"
        sprocket-amount="myCtrl.sprockets">
</my-directive>

我的指令定义如下：

        return {
            scope: {
                widgetAmount                : '=',
                sprocketAmount              : '=',
                ....

然后该指令允许用户修改小部件数量。

我遇到的问题是，在我的指令代码中，我想用小部件数量的ORIGINAL值进行一些计算，但我似乎无法保存该值。我试过angular.copy无济于事。它似乎只是给我一个副本，它也随着指令中的值而变化。如何在保留双向绑定的同时获取此变量的原始值？

Answer 1

我希望我正确地解释这一点。

使用案例

在指令中保留双向有界值的原始值。

解决方案

您可以使用指令的控制器来保留该值。

代码

function myDirective() {
    return {
        scope: {
            widgetAmount: '=',
            sprocketAmount: '='
        },
        ...
        controller: function($scope) {
            // Retain the original value
            $scope.original = $scope.widgetAmount;

            // Modify the widgetAmount
            $scope.widgetAmount *= 2;
        }
    };
};

实施例

JSFiddle Demo

HTML模板

<div ng-app="app">
    <div ng-controller="ctrl">
        <my-directive
            ng-model="myCtrl.widgets"
            widget-amount="myCtrl.widgets"
            sprocket-amount="myCtrl.sprockets">
        </my-directive>
    </div>
</div>

Angular Code

angular.module('app', [])
       .directive('myDirective', myDirective);

function ctrl($scope) {
    $scope.myCtrl = {
        widgets : 5,
        sprockets : 10
    }
}

function myDirective() {
    return {
        restrict: 'E',
        scope: {
            widgetAmount: '=',
            sprocketAmount: '='
        },
        template: '<pre>{{ original }} {{ widgetAmount }} {{ sprocketAmount }}</pre>',
        controller: function($scope) {
            $scope.original = $scope.widgetAmount;

            $scope.widgetAmount *= 2;
        }
    };
};