zoukankan      html  css  js  c++  java
  • [AngularJS] angular-formly: Default Options

    angular-formly allows you to keep your forms as DRY as possible. TheoptionsTypes property is one way of composing your field configurations to keep your forms light-weight and DRY.

    /* global angular */
    (function() {
      
      'use strict';
    
      var app = angular.module('formlyExample', ['formly', 'formlyBootstrap']);
      
      app.run(function(formlyConfig) {
        formlyConfig.setType({
          name: 'ipAddress',
          defaultOptions: {
            templateOptions: {
              label: 'IP Address',
              placeholder: '127.0.0.1'
            },
            validators: {
              ipAddress: function($viewValue, $modelValue) {
                var value = $modelValue || $viewValue;
                return !value || validateIpAddress(value);
              }
            }
          },
          controller: function($scope) {
            console.log($scope);
          }
        });
        
        function validateIpAddress(value) { 
          return value && /(d{1,3}.){3}d{1,3}/.test(value);
        }
        
      });
    
      app.controller('MainCtrl', function MainCtrl() {
        var vm = this;
        // funcation assignment
        vm.onSubmit = onSubmit;
    
        // variable assignment
        vm.model = {};
        vm.fields = [
          {
            type: 'input',
            key: 'ipAddress',
            optionsTypes: ['ipAddress'],
            templateOptions: {
              label: 'My IP Address'
            }
          }
        ];
        
        
        // copy fields because formly adds data to them
        // that is not necessary to show for the purposes
        // of this lesson
        vm.originalFields = angular.copy(vm.fields);
        
        // function definition
        function onSubmit() {
          alert(JSON.stringify(vm.model), null, 2);
        }
      });
    
    })();
  • 相关阅读:
    fescar中文官网
    mybatis 中的 update 返回值你真的明白吗
    数据库读写分离搭建
    git 回退各种场景操作
    听说noip2015有幻方
    noi2015的回忆和教训
    bzoj4026
    bzoj4127
    bzoj2119
    关于fft的一点总结
  • 原文地址:https://www.cnblogs.com/Answer1215/p/4499229.html
Copyright © 2011-2022 走看看