AngularJS ng-style 与 ng-model 范围变量答案

【问题标题】：AngularJS ng-style with ng-model scope variableAngularJS ng-style 与 ng-model 范围变量
【发布时间】：2016-12-24 07:07:35
【问题描述】：

我正在构建一个网站，让用户设计自己的移动应用。网站的一侧有一个用户填写的表单，另一侧有基于表单数据的应用程序的实时预览。它是这样设置的：

控制器：

$scope.primaryColor = "#325490";

表单输入：

<!-- Primary Color -->
<div class="form-group">
    <label for="primaryColor" class="col-sm-2 control-label">Primary:</label>
    <div class="col-sm-10">
        <input type="text" class="form-control" ng-model="$parent.primaryColor">
    </div>
</div>

实时预览：

<div class="mockView" ng-style="{'background-image':'url({{$parent.backgroundFile}})', 'background-color':'{{$parent.primaryColor}}'}">

我必须使用 $parent，因为我在索引页面上使用 ng-include 来包含 form.htm 和 preview.htm 文件。我已经测试了表单，我知道它正在改变我拥有的所有范围变量，但预览器没有改变。任何帮助表示赞赏！

【问题讨论】：

标签： css angularjs cordova ionic-framework

【解决方案1】：

删除 {{}} 和 '' 它应该可以工作，如下所示：

<div class="mockView" ng-style="{'background-image':'url({{$parent.backgroundFile}})', 'background-color': $parent.primaryColor }">

【讨论】：