成都网站建设设计

将想法与焦点和您一起共享

HTML中实现通讯录界面切换的示例

这篇文章主要介绍HTML中实现通讯录界面切换的示例,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

成都创新互联专注于沾化企业网站建设,响应式网站开发,商城网站建设。沾化网站建设公司,为沾化等地区提供建站服务。全流程按需制作网站,专业设计,全程项目跟踪,成都创新互联专业和态度为您提供的服务

具体代码如下所示:




  
  用ionic(选项卡栏tab) icon(图标) ionic上拉菜单(ActionSheet) 实现通讯录界面切换操作
  
  
  
  angular.module('myApp', ['ionic'])
    .controller('RootCtrl', function($scope) {
      $scope.onControllerChanged = function(oldController, oldIndex, newController, newIndex) {
        console.log('Controller changed', oldController, oldIndex, newController, newIndex);
        console.log(arguments);
      };
    })
    .controller('HomeCtrl', function($scope, $timeout, $ionicModal, $ionicActionSheet) {
      $scope.items = [];
      $ionicModal.fromTemplateUrl('newTask.html', function(modal) {
        $scope.settingsModal = modal;
      });
      //ionic 上拉菜单(ActionSheet)
      var removeItem = function(item, button) {
        $ionicActionSheet.show({
          buttons: [],
          destructiveText: 'Delete Task',
          cancelText: 'Cancel',
          cancel: function() {
            return true;
          },
          destructiveButtonClicked: function() {
            $scope.items.splice($scope.items.indexOf(item), 1);
            return true;
          }
        });
      };
      var completeItem = function(item, button) {
        item.isCompleted = true;
      };
      $scope.onReorder = function(el, start, end) {
        ionic.Utils.arrayMove($scope.items, start, end);
      };
      $scope.onRefresh = function() {
        console.log('ON REFRESH');
        $timeout(function() {
          $scope.$broadcast('scroll.refreshComplete');
        }, 1000);
      }
      $scope.removeItem = function(item) {
        removeItem(item);
      };
      $scope.newTask = function() {
        $scope.settingsModal.show();
      };
      // Create the items
      $scope.user = [
        {
          name:"Ben Sparrow",
          words:"You on your way?"
        },
        {
          name:"Max Lynx",
          words:"Hey,it's me."
        },
        {
          name:"Adam Bradleyson",
          words:"I should buy a boat."
        },
        {
          name:"Perry Governor",
          words:"Look at my mukluks!"
        },
        {
          name:"Mike Harrinqton",
          words:"This is wicked good ice cream."
        },
      ];
    })




  
    
      Chats
    
    
      
      
        
          
            
            {{item.name}}

            {{item.words}}

                       
                                      Deadlines                 
               
                      Settings                 
               
       

html是什么

html的全称为超文本标记语言,它是一种标记语言,包含了一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体,html文本是由html命令组成的描述性文本,html命令可以说明文字,图形、动画、声音、表格、链接等,主要和css+js配合使用并构建优雅的前端网页。

以上是“HTML中实现通讯录界面切换的示例”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!


分享标题:HTML中实现通讯录界面切换的示例
文章地址:http://chengdu.cdxwcx.cn/article/pejess.html