当前位置: 首页 > 编程笔记 >

模板视图和AngularJS之间冲突的解决方法

寇涵容
2023-03-14
本文向大家介绍模板视图和AngularJS之间冲突的解决方法,包括了模板视图和AngularJS之间冲突的解决方法的使用技巧和注意事项,需要的朋友参考一下

本文实例讲述了模板视图和AngularJS之间冲突的解决方法。分享给大家供大家参考,具体如下:

问题:

在php的mvc视图中,我们需要在加载的过程中

传递一些数据给模板:

如:

这里是某个 controller

$data['users'] = {something from databases};
$this->load->view('home/index',$data);

这里是对应的视图

<div ng-controller="loadData">
   <ul>
    <!--1. 初始化的时候我们需要使用下面这句-->
    <?php foreach(users as user):?>
    <li><?=$user->name?>:<?=$user->email?><li>
    <?php endforeach?>
    <!--2. 但是结束后 我们需要使用这句 通过ajax 更新 -->
    <li ng-repeat="user in users">{{user.name}}:{{user.email}}</li>
  </ul>
</div>

那么现在问题来了 如何处理 1 和 2 之间的矛盾?

第一种解决方案:

<script>
 var usersPrefetch = [
  <?php foreach(users as user):?>
  {"name": "<?=$user->name?>", "email": "<?=$user->email?>"},
  <?php endforeach?>
 ];
</script>

我们将 php传过来的数据存储在变量里,然后再通过
$scope对其进行赋值,ok

第二种解决方案(推荐):

我们使用ng-if属性解决我们的问题,对于users未定义时调用php数据
ajax传递完成后使用我们的数据并定义 $scope.users

<ul ng-if="!users">
 <?php foreach(users as user):?>
 <li><?=$user->name?>:<?=$user->email?><li>
 <?php endforeach?>
</ul>
<ul ng-if="users">
 <li ng-repeat="user in users">{{user.name}}:{{user.email}}</li>
</ul>

demo演示地址:https://jsfiddle.net/mser49aq/1/

希望本文所述对大家AngularJS程序设计有所帮助。

 类似资料:
  • 问题内容: 我与golang html / template和angularjs分隔符冲突。我知道有一种方法可以更改Go中的定界符,但它对我不起作用。也许应该在解析文件之前调用它?您能否提供一个示例,说明应如何实施。 我发现很多评论认为AngularJS和Go应该没有任何冲突,因为它们应该分开使用。据我了解,Go应该仅用于后端(REST)。问题是,应如何加载AngularJS,HTML?在这种情况

  • 问题内容: 我想将AngularJS与Django一起使用,但是它们都用作模板标记。有没有一种简单的方法可以将两者之一更改为使用其他自定义模板标签? 问题答案: 对于Angular 1.0,你应该使用$ interpolateProvider api配置插值符号:http : //docs.angularjs.org/api/ng.$interpolateProvider。 这样的事情应该可以解决

  • Windows 用tutorial进行的操作 若要进行pull操作,请右击tutorial目录,并选择‘拉取’。 用tutorial进行的操作 在以下画面点击‘确定’。 用tutorial进行的操作 我们看到画面上的警告信息表示自动合并失败。请点击‘关闭’以退出窗口。 用tutorial进行的操作 若您确认变更,请点击‘Yes’。 用tutorial进行的操作 TortoiseGit告诉我们:因"

  • 在上一个页面我们提及到,执行合并即可自动合并Git修改的部分。但是,也存在无法自动合并的情况。 如果远程数据库和本地数据库的同一个地方都发生了修改的情况下,因为无法自动判断要选用哪一个修改,所以就会发生冲突。 Git会在发生冲突的地方修改文件的内容,如下图。所以我们需要手动修正冲突。 ==分割线上方是本地数据库的内容, 下方是远程数据库的编辑内容。 如下图所示,修正所有冲突的地方之后,执行提交。

  • 解决冲突 CVS使用内联“冲突标志”来标记冲突,并且在更新时打印C。历史上讲,这导致了许多问题,因为CVS做得还不够。许多用户在它们快速闪过终端时忘记(或没有看到)C,即使出现了冲突标记,他们也经常忘记,然后提交了带有冲突标记的文件。 Subversion通过让冲突更明显来解决这个问题,它记住一个文件是处于冲突状态,在你运行svn resolved之前不会允许你提交修改,详情见“解决冲突(合并别人

  • 我有一个Grails 3.3.6应用程序。我想在这个应用程序中合并来自不同Spring启动应用程序的一些neo4j功能。所以我从Spring启动应用程序中添加了以下deps- 并将源文件放在我的Grails应用程序的src文件夹中。spring boot应用程序正在使用一个配置类来创建bean,如下所示- 当我运行grails应用程序时,我得到了Spring bean冲突异常。看起来Grails和