标签: angular-ui

我正在使用angular.js和(为了参数)bootstrap.现在我需要迭代"事物"并在"行"中显示它们:

<div class="row">
  <div class="span4">...</div>
  <div class="span4">...</div>
  <div class="span4">...</div>
</div>
<div class="row">
  etc...

现在,我怎么能用.row角度来关闭每三分之一的div？我试过ui-if来自angular-ui,但即便如此也没有.

如果我要使用服务器端渲染,我会做这样的事情(JSP语法在这里,但无关紧要):

<div class="row>
  <c:forEach items="${things}" var="thing" varStatus="i">
    <div class="span4">
        ..
    </div>
  <%-- Here is the trick:--%>
  <c:if test="${i.index % 3 == 2}">
          </div><div class="row">
  </c:if>
  </c:forEach>
</div>

请注意,我需要在这里实际更改DOM,而不仅仅是css隐藏元素.我尝试重复.row和.span4divs,没有用.

我想实现一个设置,我可以在主模块中定义"根状态",然后在其他模块中添加子状态.这个,因为我需要根状态才能解决才能进入子状态.

显然,根据此FAQ,这应该是可能的: 如何:从多个模块配置ui-router

对我来说它不起作用: 错误未捕获错误:从ngBoilerplate.foo没有这样的状态'app'

这是我有的:

app.js

angular.module( 'ngBoilerplate', [
  'templates-app',
  'templates-common',
  'ui.state',
  'ui.route',
  'ui.bootstrap',
  'ngBoilerplate.library'
])
.config( function myAppConfig ( $stateProvider, $urlRouterProvider ) {
    $stateProvider
        .state('app', {
            views:{
                "main":{
                    controller:"AppCtrl"
                }
            },
            resolve:{
                Auth:function(Auth){
                    return new Auth();
                }
            }
        });
    $urlRouterProvider.when('/foo','/foo/tile');
    $urlRouterProvider.otherwise( '/foo' );
})
.factory('Auth', ['$timeout','$q', function ($timeout,$q) {
    return function () {
        var deferred = $q.defer();
        console.log('before resolve');
        $timeout(function () {
            console.log('at resolve');
            deferred.resolve();
        }, 2000);

        return deferred.promise;

    };
}])
.run(function run( $rootScope, $state, $stateParams ) …

我想知道如何在加载数据之前显示一个简单的加载器.我正在使用ng-grid-1.3.2我正在使用Google搜索,但我没有找到任何示例.再见

我曾经有一个使用bootstrap模式的登录对话框:

  $scope.loginDialog = {
    backdrop: true,
    keyboard: true,
    windowClass: "modal loginDialog",
    backdropClick: true,
    templateUrl: '/tmpl/user/loginForm',
    controller: function dialogController($scope, $modalInstance) {
      $scope.submit = function () {
        $http.post('/api/login', $scope.user).success(...);
      }
    }
  };

登录表单如下所示:

form#loginBox(ng-submit="submit()")
  .modal-body.login-box
    .formItem
      label(for='user[usernameOrEmail]') Name or Email:
      input(type='text', name='user[usernameOrEmail]', required="required", value='', ng-model="user.user")
    .formItem
      label(for='user[password]') Password:
      input(name='user[password]', type='password', value='', required="required", ng-model="user.password")
  .modal-footer
    input.btn.btn-primary( type="submit", value="Login")

在角度ui 0.4和angularjs 1.1.3中,这很好.

我已经更新到最新的角度ui 0.6和1.2rc2,现在这已经不再适用了.具体$scope.user不再与表格中的那个相同.如何获取表单元素的$ scope？我在batarang中看到它,但不是来自loginDialog控制器.

谢谢

我是angularJS的初学者,我正在使用node/bower/grunt为angularJS中的单页应用程序开发ui,我已经安装了angular-ui-bootstrap和来自angular-ui-utils的路由和事件工具.
我已经ng-class={active:$uiRoute}在菜单项上使用了但是当选择了一个菜单项时,没有应用活动类...是否$uiRoute处理了这个或者我是否需要单独编写它？

问一个愚蠢的问题道歉...
这是代码:

`<div class="collapse navbar-collapse">
  <ul class="nav navbar-nav">
    <li ui-route="/" ng-class="{active:$uiRoute}"><a href="#/">Home</a></li>
    <li ui-route="/about" ng-class="{active:$uiRoute}"><a href="#/about">About</a></li>
    <li ui-route="/other" ng-class="{active:$uiRoute}"><a href="#/other">Other</a></li>
  </ul>
</div>
...
<script src="bower_components/angular-ui-utils/modules/route/route.js"></script>
<script src="bower_components/angular-ui-utils/modules/event/event.js"></script>`

和

angular.module('myApp', ['ngRoute','ngResource','ui.bootstrap'])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
    templateUrl: 'views/main.html',
    controller: 'MainCtrl'
  })
  .when('/about', {
      templateUrl: 'views/about.html',
      controller: 'AboutCtrl'
  })
  .when('/other', {
    templateUrl: 'views/other.html',
    controller: 'OtherCtrl'
  })
  .otherwise({
    redirectTo: '/'
  });
})

我从未使用过css预处理器.

我想在angularUI(bootstrap)中使用angularjs,我想知道使用SASS vs LESS有什么不利之处.或者是完全独立,我完全可以使用SASS或LESS与AngularJS和AngularUI引导程序.

也许AngularUI内置了对SASS或LESS的支持,所以我应该支持其中一个？

例如,我想在导航中进行此更改以重新加载状态:

• #/detail/1
• #/detail/2

但我不希望这个导航重新加载状态:

• #/detail/1?search=blah
• #/detail/1?search=huzzah

根据ui-router文档,设置reloadOnSearch: false应该完成这个,但尝试下面的插件.何时reloadOnSearch === false,更改路径参数不会重新加载状态,即使文档说它应该.

Plunkr:http: //run.plnkr.co/ZPy9uabYlkMilwdS/#/param

我正在使用Angular-UI的旋转木马,我需要告诉我的谷歌图表在他们滑入视图后重绘.尽管我已经阅读过,但我似乎无法参与此事件.

看看我的尝试:http: //plnkr.co/edit/Dt0wdzeimBcDlOONRiJJ？p = preview

HTML:

<carousel id="myC" interval="myInterval">
  <slide ng-repeat="slide in slides" active="slide.active">
    <img ng-src="{{slide.image}}" style="margin:auto;">
    <div class="carousel-caption">
      <h4>Slide {{$index}}</h4>
      <p>{{slide.text}}</p>
    </div>
  </slide>
</carousel>

在文档加载:

$('#myC').live('slid.bs.carousel', function (event) { console.log("slid"); } );

它应该是这样的:http: //jsfiddle.net/9fwuq/ - non-angular-ui carousel

也许有更多的Angular方式来勾解我的图表已滑入视野的事实？

你知道在ui-router中获取给定状态的子状态列表的方法吗？

我正在使用ui-router实现一个带有4级深度导航的复杂SPA.

我想为路由器表自动生成的第二级实现导航选项卡界面.

为此,我需要获得给定状态的直接子节点列表(可能是一个抽象状态).我发现获得状态的唯一方法是做一个$state.get()并获得完整的状态列表,但这意味着我必须自己解析子状态,我认为这些代码已经用ui-编写了路由器.

我在这里提出这个问题,以防有任何人有源代码经验或知道插件或模块可以帮助我.同时,如果我发现了什么,我将自己做一个研究并发布结果.

我有一个angular-ui按钮,如下所示:

<button uib-btn-checkbox ng-model="sortReverse" class="btn btn-default" ng-init="sortReverse=true"> <i class="fa" ng-class="{'fa-sort-asc': sortReverse===true,'fa-sort-desc': sortReverse===false}"></i></button>

这很好用.

每次模型变为true时,active该类都应用于元素.在文档中,他们说您可以更改选中按钮的类名.这是引用:

默认设置 uibButtonConfig

activeClass(默认值:) active- 要应用于选中按钮的类.

但我不明白应该如何做到这一点,无法在任何地方找到例子.