Question

正如您在下面的代码段中所看到的，$scope.foo在foo对象的$scope.bar属性上分配了$scope.foo。这些只是在初始化时同步。我希望在$scope.bar对象中引用angular.module('app', []) .controller('Ctrl', ['$scope', function($scope) { $scope.foo = "eeee"; $scope.bar = { foo : $scope.foo }; $scope.do = function() { alert($scope.foo); }; }]);以保持同步。

注意：
这个问题出现在AngularJS的背景下这是一个微不足道的问题，应该在JS框架中解决。

Plunker中的工作解决方案：here

问题小部件：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app">
  <div ng-controller="Ctrl">
    
    foo : 
    <input type="text" ng-model="foo"> {{foo}} <br />
    
    bar : 
    <input type="text" ng-model="bar.foo"> {{bar}} <br />
    
    
    <button type="button" ng-click="do()"> DO </button>
    
    
  </div>
</body>

@Plugin(name = "OwnJmsAppender", category = "Core", elementType = "appender", printObject = true)
public class OwnJmsAppender extends AbstractAppender {

private final Lock lock = new ReentrantLock();
private Session session;
private Connection connection;
private Destination destination;
private MessageProducer producer;

protected OwnJmsAppender(String name, Filter filter, Layout<? extends Serializable> layout, final boolean ignoreExceptions) {
    super(name, filter, layout, ignoreExceptions);
    init();
}

@Override
public void append(LogEvent le) {
    this.lock.lock();
    try {
        if (connection == null) {
            init();
        }
        byte[] bytes = getLayout().toByteArray(le);
        TextMessage message = session.createTextMessage(new String(bytes, Charset.forName("UTF-8")));
        producer.send(message);
    } catch (JMSException e) {
        LOGGER.error(e);
    } finally {
        this.lock.unlock();
    }
}

@Override
public void stop() {
    super.stop();
    try {
        session.close();
        connection.close();
    } catch (JMSException e) {
        LOGGER.error(e);
    }

}

/**
 * Reading attributes from log4j2.xml configuration by {@link PluginElement}
 * annotation. Also initiates the logger.
 * 
 * @param name
 * @param layout
 * @param filter
 * @return
 */
@PluginFactory
public static OwnJmsAppender createAppender(@PluginAttribute("name") String name,
        @PluginElement("PatternLayout") Layout<? extends Serializable> layout, @PluginElement("Filter") final Filter filter) {
    if (name == null) {
        LOGGER.error("No name provided for OwnJmsAppender");
        return null;
    }

    return new OwnJmsAppender(name, filter, getLayout(layout), true);
}

private static Layout<? extends Serializable> getLayout(Layout<? extends Serializable> layout) {
    Layout<? extends Serializable> finalLayout = layout;
    if (finalLayout == null) {
        finalLayout = PatternLayout.createDefaultLayout();
    }
    return finalLayout;
}

private void init() {
    AnnotationConfigApplicationContext context = new AnnotationConfigApplicationContext(CommonDbConfig.class);
    ParameterStorage parameterStorage = (DatabaseParameterStorage) context.getBean("databaseParameterStorage"); 
    // the parameterStorage springbean reads params from database
    String brokerUri = parameterStorage.getStringValue("broker.url");
    String queueName = "logQueue";
    context.close();

    try {
        ActiveMQConnectionFactory connectionFactory = new ActiveMQConnectionFactory(brokerUri);
        connection = connectionFactory.createConnection();
        connection.start();
        session = connection.createSession(false, Session.AUTO_ACKNOWLEDGE);
        destination = session.createQueue(queueName);
        producer = session.createProducer(destination);
        producer.setDeliveryMode(DeliveryMode.NON_PERSISTENT);
    } catch (JMSException e) {
        LOGGER.error(e);
    }
}

Answer 1

字符串在javascript中是不可变的，因此当您执行foo : $scope.foo时，您将字符串的值分配给对象的属性，而不是对$scope.foo的引用。

保持同步的最佳方法是将字符串值包装在对象中，并使用它们来保持引用。

angular.module('app', [])

.controller('Ctrl', ['$scope', function($scope) {
 
    $scope.bar = {
        foo : {value: "eeee"}
    };
    $scope.foo = $scope.bar.foo;
    
    $scope.do = function() {
        alert($scope.foo.value);
    };
    
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app">
  <div ng-controller="Ctrl">
    
    foo : 
    <input type="text" ng-model="foo.value"> {{foo.value}}<br />
    
    bar : 
    <input type="text" ng-model="bar.foo.value"> {{bar}} <br />
    
    
    <button type="button" ng-click="do()"> DO </button>
    
    
  </div>
</body>

Answer 2

在Javascript中，当您在执行期间定义数组时，变量将在执行时解析：

$scope.foo = 5;
$scope.bar = {
    foo : $scope.foo
};

如果您现在$scope.foo = 7;，$scope.bar.foo仍为5。

要访问新值，您可以直接访问$ scope.foo。如果由于某种原因必须保持同步，可以使用Angular手表：

$scope.$watch('foo', function(newVal) { $scope.bar.foo = newVal; });

请注意，此类监视仅适用于下一个摘要周期（更新$scope.foo时不会立即应用）。此外，绑定只是一个方向。

AngularJS：为Object属性

2 个答案: