美文网首页Angular.js专场
AngularJs 问题总结

AngularJs 问题总结

作者: Nickyzhang | 来源:发表于2017-12-03 12:14 被阅读19次
一、ng-if/ng-show

最根本的区别是页面是否会生成此DOM元素

二、ng-repeat迭代数组的时候,如果数组中有相同值,会有什么问题,如何解决?

会提示 Duplicates in a repeater are not allowed.,数据与DOM之间一对一的关系在数据相同的情况下不成立。通过 track by key key 为数组的唯一标识,目的是建立数组与DOM的关联。

三、ionic ion-slide-box bug
ion-slide-box在数量为两个的情况下会造成 ion-slide的数量由2个变成4个
  1. 修改slideChanged方法

     $scope.slideChanged = function(index) {  
         $scope.slideIndex = index;  
         if ( ($ionicSlideBoxDelegate.count() -1 ) == index ) {  
             $timeout(function(){  
                 $ionicSlideBoxDelegate.slide(0);  
             },3000);  
         }  
     };
    

在数据为2的时候手动调用 $ionicSlideBoxDelegate.slide(0) 跳转到第一个

  1. 修改源码

     $scope.numSlides = function() {
         if (!slideBox._length){
             slideBox._length = slideBox.slidesCount() || 0;
         }
         return new Array(slideBox._length);
     };
     $scope.$watch('currentSlide', function(v) {
         selectPage(v%(slideBox.slidesCount()||0));
     });
    

ionic.bundle.js 的第63314行附近,修改以上两个方法。执行slideBox个数的取余操作

四、在Html页面调取JS原生方法(parseInt)失效?

在页面中,都不能直接调用原生的JS 方法,因为这些并不存在于与页面对应的Controller 的$scope 中

五、Controller之间的通信
  1. 作用域继承。利用子Controller控制父 Controller 上的数据。(父 Controller中的数据要为引用类型,不能是基本类型)这同时也说明了为什么ng-if会产生数据绑定不成功的原因。

  2. 注入服务。把需要共享的数据注册为一个 service(通过service可以生成一个单例对象或通过factory生成一个function)在需要的Controller中注入。

  3. 基于事件。利用Angular的事件机制,使用 $on$emit$boardcast.$broadcast 会把事件广播给所有子 Controller,而 $emit 则会将事件冒泡传递给父 Controller$on 则是 Angular 的事件监听函数.

  4. $rootScope。每个Angular应用默认有一个根作用域 $rootScope, 根作用域位于最顶层,从它往下挂着各级作用域。

Factory、Service、Provider
AngularJs作用域

更新中。。。。。。

相关文章

  • AngularJs 问题总结

    一、ng-if/ng-show 最根本的区别是页面是否会生成此DOM元素 二、ng-repeat迭代数组的时候,如...

  • Angularjs项目常见问题总结

    1.Angularjs项目页面加载两次 使用Angularjs搭的框架,每次刷新页面都加载两次,进行两次数据请求,...

  • AngularJs总结

    angularJs在前端开发过程中是一件重器,它使得前端代码编辑简单,数据变化方便,尤其是可以让页面切换流畅。接下...

  • angularJS总结

    内置指令 自定义指令 控制器 作用域 内置过滤器 自定义过滤器 路由 ui.router 项目搭建 建议:继...

  • Angularjs 总结

    官方网站 angular是什么:为动态web应用设计的结构框架; 核心的功能: 1,双向数据绑定:实现了model...

  • AngularJS指令小结

    刚刚接触AngularJS,总结了一些关于AngularJS的基本指令。 1、 ng-bind-html 类似于h...

  • 看书总结之AngularJS权威教程

    title: 看书总结之AngularJS权威教程 第一章 初始AngularJS 1.浏览器是如何获取网页的 当...

  • Angularjs简介(二)

    原因:2016年11月23日 星期三 继Angularjs项目(1)后接着总结开发的经验与遇到的问题。说明:本记录...

  • AngularJS 指令总结

    22、ng-options 使用数组元素填充下拉列表 23、设置为只读 24、ng-selected 属性的表达式...

  • angularjs总结整理

    一、angular介绍 1、angular是Google公司提供的一套基于MVC结构的js开发工具,其核心功能就是...

网友评论

    本文标题:AngularJs 问题总结

    本文链接:https://www.haomeiwen.com/subject/qreabxtx.html