那些遇到过的问题

标签: angular-ui

如何使用angular.element find函数来搜索JQuery选择器？ 

describe("create a simple directive", function () {


    var simpleModule = angular.module("directivesSample", []);


    simpleModule.controller('Ctrl2', function ($scope) {
        $scope.format = 'M/d/yy h:mm:ss a';
    });

    simpleModule.directive("myCurrentTime", function ($timeout, dateFilter) {

        return function (scope, element, attr) {
            var format;
            var timeoutId;

            function updateTime() {
                element.text(dateFilter(new Date(), format));
            }

            scope.$watch(attr.myCurrentTime, function (value) {
                format = value;
                updateTime();
            });
            function updateLater() {
                timeoutId = $timeout(function () {
                    updateTime();
                    updateLater();

                }, 1000);
            }

            element.bind('$destroy', function () {
                $timeout.cancel(timeoutId);
            });
            updateLater();
        }


    });


    beforeEach(module('directivesSample'));

    var element = angular.element( …
Run Code Online (Sandbox Code Playgroud)

angularjs angular-ui angularjs-directive

Ade*_*lin
lucky-day
2
推荐指数
1
解决办法
9931
查看次数

可以一次在转盘中显示两张幻灯片吗？

我刚刚开始学习Angular.js,我正在使用Angular-ui中的Carousel控件.是否可以同时显示两张幻灯片而不是一张？

我想显示像这样的图像 - 

< image 1 image 2 >
then
< image 3 image 4 >
then
< image 5 image 6 >
Run Code Online (Sandbox Code Playgroud)

这是一个样本 -

http://plnkr.co/edit/BnErmMDl8nPvXPrw3ULu?p=preview

carousel twitter-bootstrap angularjs angular-ui angular-ui-bootstrap

tem*_*pid
lucky-day
2
推荐指数
1
解决办法
1万
查看次数

ng-grid在IE8中不起作用

我很想弄清楚为什么ng-grid不能在IE8中工作.我收到这个错误:Expected identifier, string or number ng-grid-2.0.5.debug.js, line 1535 character 17.

我正在直接从ng-grid主页复制一个例子(顺便说一下,所有示例都正确加载).有人有想法吗？

我会提出一个Plnkr或小提琴,但在IE8中都不会加载,所以它有点挫败了目的.

使用Angular 1.0.4,jQuery 1.8.1,ng-grid 2.0.5

HTML

<html ng-app="myApp">  
<head lang="en">
    <meta charset="utf-8">
    <title>Getting Started With ngGrid Example</title>  
    <link rel="stylesheet" type="text/css" href="ng-grid.css" />
    <link rel="stylesheet" type="text/css" href="style.css" />
    <script type="text/javascript" src="jquery-1.8.1.js"></script>
    <script type="text/javascript" src="angular.js"></script>
    <script type="text/javascript" src="ng-grid-2.0.5.js"></script>
    <script type="text/javascript" src="main.js"></script>
</head>
<body ng-controller="MyCtrl">
    <div class="gridStyle" ng-grid="gridOptions"></div>
</body>
Run Code Online (Sandbox Code Playgroud)

CSS

.gridStyle {
  border: 1px solid rgb(212,212,212);
  width: 400px; 
  height: 300px;
}
Run Code Online (Sandbox Code Playgroud)

使用Javascript

var app = angular.module('myApp', ['ngGrid']);
app.controller('MyCtrl', function($scope) { …
Run Code Online (Sandbox Code Playgroud)

angularjs angular-ui ng-grid

Spe*_*cer
lucky-day
2
推荐指数
1
解决办法
4938
查看次数

AngularJS:来自bootstrap-ui手风琴的访问范围

我正试图在ui-bootstrap手风琴中观察模型的变化.绑定在视图中工作,但是当模型更改时,$ watch不会触发.

http://plnkr.co/edit/DcoGT2?p=preview

如何在控制器中获取$ scope.myModel的值？

angularjs angular-ui

use*_*109
lucky-day
2
推荐指数
1
解决办法
2883
查看次数

Angular ui-bootstrap手风琴无法正常工作

直接从
http://angular-ui.github.io/bootstrap/复制的示例
根本不起作用,既不在本地也不在plunker中.不知道为什么.Bootstrap CSS被加载,ui-bootstrap-tpls.min.js和angular.min.js也是如此(尽管角度本身工作得很好).
这里是plunker:
http://plnkr.co/edit/15GWWFSUwab4VmaxfFPf
我在浏览器中没有js错误,但它无法正常工作.
请帮忙.我需要在我的网站上使用它(即使我写自己的html/js代码时手风琴也不起作用).

accordion angularjs angular-ui

Jar*_*ski
lucky-day
2
推荐指数
1
解决办法
2万
查看次数

angular-ui:ui-router动态路由和状态

我有一个动态路由定义为:

$urlRouterProvider
    .when(
        '/:resource?collection&type&id',
        [
            '$match', '$stateParams',
            function routeValidator( $match , $stateParams )
            {
                var path = '';
                angular.forEach($match, function joinner( val , key )
                {
                    if ( angular.isDefined(val) ) path += '/' + val;
                });
                return path;
            }
        ]
    )
    .when( '' , '/about' )
    .when( '/' , '/about' )
    .otherwise( '/404' );
Run Code Online (Sandbox Code Playgroud)

然后是几个州:

$stateProvider
    .state('about',
        {
            "url":          "/about",
            "templateUrl":  "about.tmpl"
        }
    )
    //…
Run Code Online (Sandbox Code Playgroud)

我尝试点击index.html#/或者index.html#/about,我的状态都没有被调用(后来没有我的控制器).但是我的路线被遵守(前''被重定向到'/ about').没有控制台错误和值按预期返回(例如index.html#/about,$ match&path = /about).

编辑

似乎需求是问题的一部分:

javascript requirejs angularjs angular-ui angular-ui-router

jac*_*cob
2013 12-07
2
推荐指数
1
解决办法
2978
查看次数

单元测试angular-bootstrap $ modal

我在尝试为Angular-Bootstrap编写茉莉花单元测试时遇到了问题$modal.确切的错误是 Expected spy open to have been called with [ { templateUrl : '/n/views/consent.html', controller : 'W2ConsentModal as w2modal', resolve : { employee : Function }, size : 'lg' } ] but actual calls were [ { templateUrl : '/n/views/consent.html', controller : 'W2ConsentModal as w2modal', resolve : { employee : Function }, size : 'lg' } ]

预期和实际的模态选项对象是相同的.到底是怎么回事？

调节器

(function () {
    'use strict';

    angular
        .module('app')
        .controller('W2History', W2History);

    W2History.$inject = ['$scope', '$modal', 'w2Service'];

    function W2History($scope, $modal, w2Service) { …
Run Code Online (Sandbox Code Playgroud)

javascript unit-testing jasmine angularjs angular-ui

rwi*_*h45
lucky-day
2
推荐指数
1
解决办法
6244
查看次数

在bootstrap验证器中手动设置有效性

是否可以在bootstrap验证器中手动将字段有效性设置为无效？

我在我的项目中使用角度js并希望使用日期范围验证.

"max-date"属性工作正常,除非我手动输入日期,这就是我想在控制器中重新验证字段并手动设置字段有效性的原因.

HTML:

    <div class="form-group inputGroupContainer" ng-controller="DatepickerCtrl">
        <label for="date">Date of Birth</label>
        <p class="input-group">
            <input type="text" name="date1"  placeholder="DD/MM/YYYY" class="form-control"  ui-date="{dateFormat: 'dd/MM/yyyy'}" ui-date-format="dd/MM/yyyy" datepicker-popup="{{format}}" ng-model="user.Personal.BirthDate" max-date="currentDate" is-open="opened" close-text="Close" />
            <span class="input-group-btn">
                <button type="button"   class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
            </span>
        </p>
    </div>
Run Code Online (Sandbox Code Playgroud)

angularjs控制器:

$scope.$watch('user.Personal.BirthDate', function (newValue, oldValue) {
                    if (newValue !== oldValue) {
                        if ($scope.user.Personal.BirthDate)
                            if ($scope.user.Personal.BirthDate.getTime() > new Date().getTime()) {
//set validity for "date1" to invalid
                            }
                        $($('#editPersonalForm')).bootstrapValidator('revalidateField', 'date1');
                    }
                });
Run Code Online (Sandbox Code Playgroud)

validation angularjs angular-ui

mk_*_*_yo
lucky-day
2
推荐指数
1
解决办法
2784
查看次数

如何将图标添加到AngularUI日历

我使用了这个AngularUI日历

我想添加像这样的图标(Bootstrap glyphicons)

在此输入图像描述

请帮忙,

谢谢

calendar angularjs glyphicons angular-ui

Men*_*sam
2017 01-20
2
推荐指数
1
解决办法
366
查看次数

角度材质扩展面板错误 - TypeError:this.driver.containsElement不是函数

Angular材质的扩展面板取决于BrowserAnimationsModule.我已经包含了动画模块,但是当我创建一个简单的扩展面板时,它崩溃并出现错误:

错误TypeError:this.driver.containsElement不是TransitionAnimationEngine.push ../ node_modules上TransitionAnimationEngine.push ../ node_modules/@angular/animations/fesm5/browser.js.TransitionAnimationEngine._balanceNamespaceList( browser.js:2765)的函数.在TransitionAnimationEngine.push ../node_modules/@angular/animations/fesm5/browser.js.TransitionAnimationEngine.register(browser.js:/@angular/animations/fesm5/browser.js.TransitionAnimationEngine.createNamespace( browser.js:2743) 2784)在InjectableAnimationEngine.push ../ node_modules/@angular/animations/fesm5/browser.js.AnimationEngine.register(browser.js:3815),在AnimationRendererFactory.push ../ node_modules/@ angular/platform-b​​rowser/fesm5/createComponentView(core.js)上的DebugRendererFactory2.push ../ node_modules/@angular/core/fesm5/core.js.DebugRendererFactory2.createRenderer(core.js:12225)的animations.js.AnimationRendererFactory.createRenderer(animations.js:140) :11179)在Object.de的callWithDebugContext(core.js:12204)createViewNodes上的bugCreateComponentView [as createComponentView](core.js:11715)(core.js:11220)

home.component.html

<div class="container-fluid">
    <div id="sidebar">
        <mat-expansion-panel>
            <mat-expansion-panel-header>
              <mat-panel-title>
                This is the expansion title
              </mat-panel-title>
              <mat-panel-description>
                This is a summary of the content
              </mat-panel-description>
            </mat-expansion-panel-header>
            <p>This is the primary content of the panel.</p>
          </mat-expansion-panel>
    </div>
    <div id="map" style="height: 550px"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

home.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';

import { …
Run Code Online (Sandbox Code Playgroud)

angular-ui angular-material angular angular-animations angular6

Roh*_*eja
lucky-day
2
推荐指数
1
解决办法
2608
查看次数

标签 统计

angular-ui ×10

angularjs ×9

javascript ×2

accordion ×1

angular ×1

angular-animations ×1

angular-material ×1

angular-ui-bootstrap ×1

angular-ui-router ×1

angular6 ×1

angularjs-directive ×1

calendar ×1

carousel ×1

glyphicons ×1

jasmine ×1

ng-grid ×1

requirejs ×1

twitter-bootstrap ×1

unit-testing ×1

validation ×1