zoukankan      html  css  js  c++  java
  • AngularJS 实现的输入自动完成补充功能

    1.首先需要引入:angucomplete.js第三方库

    2.增加model :

    var app = angular.module('app', ["angucomplete"]);
    

    3.html:

     <angucomplete id="ex1" placeholder="搜索"
                                                      pause="100" selectedobject="selectedContacts"
                                                      localdata="contactList"                         searchfields="contactName"
                                                      titlefield="contactName" minlength="1"
                                                      inputclass="form-control"
                                                      matchclass="highlight"/>
    

    4.js:

     $scope.contactList = [
            {contactName: '张三', pic: 'assets/img/avatar1.jpg'},
            {contactName: '李四', pic: 'assets/img/avatar2.jpg'},
            {contactName: '王五', pic: 'assets/img/avatar3.jpg'},
            {contactName: '赵六', pic: 'assets/img/avatar1.jpg'},
            {contactName: '张三', pic: 'assets/img/avatar1.jpg'},
            {contactName: '李四', pic: 'assets/img/avatar2.jpg'},
            {contactName: '王五', pic: 'assets/img/avatar3.jpg'},
            {contactName: '赵六', pic: 'assets/img/avatar1.jpg'}
        ];
    

    5.地址为angucomplete.js第三方库gitHub地址:https://github.com/darylrowland/angucomplete/blob/master/angucomplete.js

  • 相关阅读:
    循环排序总结
    # 区间合并总结
    快慢指针
    #双指针总结
    滑动窗口总结
    leetcode 第 221 场周赛
    剑指 Offer 07. 重建二叉树
    leetcode 406. 根据身高重建队列
    [JLOI2014]松鼠的新家 T22 D71
    软件包管理器 T21 D71
  • 原文地址:https://www.cnblogs.com/baizhanshi/p/5567109.html
Copyright © 2011-2022 走看看