ng-init 中的单/双引号答案

【问题标题】：Single/double quotes in ng-initng-init 中的单/双引号
【发布时间】：2015-01-01 15:47:04
【问题描述】：

假设我们通过 Mustache 将初始数据从 php 传递到 Angular 视图，并且数据是一些包含引号的字符串，例如 "Can't delete item"。 Mustache 默认将单引号翻译成&#039;，例如：

 ng-init="message='Can&#039;t delete item'"

但这会导致某种角度解析问题：

Lexer 错误：表达式 [message='Can't delete item'] 中的列 ... ['] 处的引号未终止

我不能使用 Mustache 的三重卷发，因为那样会是这样的：

 ng-init="message='Can't delete item'"

在输出中出现同样的错误。

Plunk：http://plnkr.co/edit/GCq4gLrD1NxxCvAsjHy9?p=preview

我们如何在 Mustache 阶段优雅地解决它？

【问题讨论】：

你应该澄清你的问题的标题。你不能在角度解析之前将&#039;替换为\'和&#34;替换为\"吗？
我不能，它正在从服务器“损坏”
你不能从你的控制器（或指令的链接函数）初始化值吗？
@arturgrzesiak 不，它是我无法更改的旧系统（具有特定的服务器/客户端关系方案）的一部分。 &#039; 的 Angular 解析机制问题是什么？
@Cherniv 没有深入研究，但如果你继续 &#039 与 \ 那么它似乎工作正常：http://plnkr.co/edit/HPmadiLEHBHs5l6XLKiV?p=preview

标签： php angularjs mustache template-engine mustache.php

【解决方案1】：

只是转义引用：

ng-init="message='Can\'t delete item'"

【讨论】：

我不能这样做，因为来自服务器的 html 已经损坏

【解决方案2】：

使用backslash \ 转义单引号，如下所示：

ng-init="message='Can\'t delete item'"

【讨论】：

转义双引号也一样
我不能这样做，因为来自服务器的 html 已经损坏
如果您使用php从服务器获取数据，请尝试htmlspecialchars_decode
如何将它与 Mustache 结合起来？
查看此处获取将 htmlspecialchars_decode() 与 Mustache 集成的灵感：stackoverflow.com/questions/17195443/…

【解决方案3】：

我相信您使用 init 不正确。来自ngInit docs：

ngInit 的唯一适当用途是为 ngRepeat 的特殊属性设置别名，如下面的演示所示。除了这种情况，您应该使用控制器而不是 ngInit 来初始化作用域上的值。

对于从服务器端传递值，我认为您应该使用 $http (AJAX) 或来自 angular.Module 的 Module.constant/Module.value。

例如：

// define a value
app.value('message','Can&#039;t delete item');

// define a constant
app.constant('constMessage', 'Can&#039;t delete item');

然后您可以将它们注入到服务或控制器中。例如，对于控制器：

// use it in a controller
app.controller('someController', ['$scope', 'message', 'constMessage', 
function($scope, message, constMessage) {
    $scope.message = message;
    $scope.constMessage = constMessage;
});

【讨论】：

谢谢，我知道value 和constant 我在我的另一个项目（stackoverflow.com/questions/18097923/…）中使用它们，但在这个特定项目中我只能使用@987654331 @传递数据的指令

【解决方案4】：

尝试切换双引号和单引号。

所以而不是

ng-init="message='{{delete_message}}'"

试试

ng-init='message="{{delete_message}}"'

【讨论】：

谢谢，但是这样如果我的delete_message 中有双引号，错误会再次出现

【解决方案5】：

如果您的问题仅限于单引号，这可能会起作用

ng-init='message="Can&#039;t delete item"'

【讨论】：

【解决方案6】：

我创建了一个指令来放置你的内容，它将指令的主体分配给 scope.message 变量。

app.directive('myMessageVar',function(){
  return{
            restrict :'A',
            scope:{
              message:'=myMessageVar'
            },
            link: function (scope, iElement, iAttrs) {
               scope.message=iElement.text(); 
               iElement.text('');
          }
   }

})

在 HTML 中

 <span my-message-var="message">Can&#039;t delete item</span>

Plunkr： http://plnkr.co/edit/QRtXLX1IiGS6VV0Rc78I?p=preview

【讨论】：

谢谢，但很遗憾我无法更改标记的结构
这是一个优雅的解决方案。谢谢！

【解决方案7】：

试试下面的代码，它应该可以工作。

<body ng-controller="MainCtrl" ng-init='message="Can't delete item"'> <p>Message: {{message}}</p> </body>

【讨论】：

【解决方案8】：

我今天遇到了这个问题，但没有找到太多答案。但是这段代码对我有用。

<?php $data_slashed = htmlentities(addslashes(html_entity_decode($data,ENT_QUOTES)),ENT_QUOTES); ?>

其中$data 是一些使用htmlentities 编码的数据。

那么你现在可以这样做了

<p ng-bind-html= "data" ng-init="data='<?php echo $data_slashed; ?>'" />

我没有尝试过 mustache，但这适用于我的 php 模板。希望这对其他人有帮助。

【讨论】：