【问题标题】:AngularJS not writing $scope variables to viewAngularJS 没有写 $scope 变量来查看
【发布时间】:2016-08-26 16:33:11
【问题描述】:

我有一个非常奇怪的问题。使用 AngularJS 1.5.8。对于以前的版本,它也不起作用。 ng-bind、ng-model、ng-submit 等函数可以正常工作。

点击“Inschrijven”http://adr-opleiding.ismiami.com/,第二步“邮政编码”并输入例如1000. 它将显示阿姆斯特丹。我使用了一个带有 ng-bind="city" 的 div 元素。如果我使用 {{city}},它将始终显示 {{city}}。我无法从控制器更新它。

angular.module('app', []).controller('HomeController', ['$rootScope', '$scope', '$stateParams', function($rootScope, $scope, $stateParams) {
$scope.$on('$viewContentLoaded', function() {
    $scope.app.settings.htmlClass = $stateParams.htmlClass.website;
    $scope.app.settings.bodyClass = '';
});
}])
.controller('WizCtrl', ['$scope', '$http', function($scope, $http) {
$scope.city = '';

$scope.printCity = function(){

    if($scope.postcode.length == 4) {
        $http({
            method: 'POST',
            url: '/db/get.php',
            data: {  action: 'retCity', zip: $scope.postcode }
        })
        .then(function success(response) {
            $scope.city = response.data.city;
        }, function error(response) {

        });
    }
}
}]);

这是 HTML:

              <div class="form-group">
                <label for="wiz-postcode" class="col-xs-4 control-label">Postcode:</label>
                <div class="col-xs-3">
                  <input class="form-control" type="text" name="wiz-postcode" id="wiz-postcode" style="width: 80px;" placeholder="Postcode" ng-keyup="printCity()" ng-model="postcode" onblur="this.value=this.value.toUpperCase()" />
                </div>
                <div class="col-xs-5" ng-bind="city" style="padding-top: 8px; font-size: 1.1em;"></div>
              </div>

在 HTML 的最顶部,我有一个带有控制器的 div 元素:

<div ng-controller="WizCtrl">

所以问题是 $scope 变量为什么可以正常工作,除了使用像这样的变量更新视图 {{test}}

【问题讨论】:

  • 可能与 HTML 模板的加载方式有关吗?当它不在模式中时,它是否会做同样的事情,而只是在一个简单的平面 HTML 中?
  • adr-opleiding.ismiami.com 见 {{test}} 这是来自主控制器。 angular.module('app') .controller('AppCtrl', [ '$scope', '$state', function ($scope, $state) { $scope.app = { settings: { htmlClass: '', bodyClass : '' } }; $scope.test = 'xxx';

标签: angularjs scope


【解决方案1】:

新的 Google 搜索“大括号中的 angularjs 变量不起作用”让我找到了 AngularJS-Twig conflict with double curly braces,从中我了解到使用 AngularJS 您可以使用变量 start 和 endSymbol 设置符号

    var app = angular.module('app')
    .config(
    [ '$controllerProvider', '$compileProvider', '$filterProvider', '$provide', '$interpolateProvider',
        function ($controllerProvider, $compileProvider, $filterProvider, $provide, $interpolateProvider) {
            app.controller = $controllerProvider.register;
            app.directive = $compileProvider.directive;
            app.filter = $filterProvider.register;
            app.factory = $provide.factory;
            app.service = $provide.service;
            app.constant = $provide.constant;
            app.value = $provide.value;

            $interpolateProvider.startSymbol('::');
            $interpolateProvider.endSymbol('::');
        }
    ]);

【讨论】:

    猜你喜欢
    • 2015-08-05
    • 2013-01-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-05-30
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多