小编cob*_*blr的帖子

Angular UI模式的范围问题

我无法理解/使用角度UI模式的范围.

虽然这里没有立即显示,但我已经正确设置了模块和所有设置(据我所知),但这些代码示例特别是我发现错误的地方.

index.html(它的重要部分)

<div class="btn-group">
    <button class="btn dropdown-toggle btn-mini" data-toggle="dropdown">
        Actions
        <span class="caret"></span>
    </button>
    <ul class="dropdown-menu pull-right text-left">
        <li><a ng-click="addSimpleGroup()">Add Simple</a></li>
        <li><a ng-click="open()">Add Custom</a></li>
        <li class="divider"></li>
        <li><a ng-click="doBulkDelete()">Remove Selected</a></li>
    </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

Controller.js(再次,重要部分)

MyApp.controller('AppListCtrl', function($scope, $modal){
    $scope.name = 'New Name';
    $scope.groupType = 'New Type';

    $scope.open = function(){
        var modalInstance = $modal.open({
            templateUrl: 'partials/create.html',
            controller: 'AppCreateCtrl'
        });
        modalInstance.result.then(function(response){

            // outputs an object {name: 'Custom Name', groupType: 'Custom Type'}
            // despite the user entering customized values
            console.log('response', response);

            // outputs "New Name", which …
Run Code Online (Sandbox Code Playgroud)

javascript scope modal-dialog angularjs angularjs-scope

80
推荐指数
3
解决办法
8万
查看次数

使用grunt将许多目录中的许多文件连接到新目录中的单个重命名文件中

我有一个可能有很多模块的Angular项目.每个模块都有自己的目录,包含控制器,指令,服务等的子目录.如下所示:

src
|-- js
    |-- modules
        |-- moduleOne
            | module.js
            |-- controllers
                | listController.js
                | detailController.js
            |-- directives
                | listItem.js
                | summaryWidget.js
            |-- filters
            |-- services
                | moduleService.js
Run Code Online (Sandbox Code Playgroud)

我的构建基本上捆绑并编译来自src /的文件并放入dev /,然后缩小dev /中的文件并移动到prod /.在开发期间,服务器指向dev /文件夹,在生产中,服务器指向prod /文件夹(也就是为什么文件以.min.js结尾,即使它们只是编译/连接).这个过程运作良好.

目前,我的concat任务是抓取moduleOne /中的所有文件,并在我的dev目录中创建一个moduleOne.js文件.这就是我想要的,但更动态:

concat: {
    modules: {
        files: {
            "dev/js/modules/moduleOne.min.js": [
                "src/js/modules/moduleOne/*.js",
                "src/js/modules/moduleOne/**/*.js"
            ],
            "dev/js/modules/moduleTwo.min.js": [
                "src/js/modules/moduleTwo/*.js",
                "src/js/modules/moduleTwo/**/*.js"
            ]
        } 
    }
}
Run Code Online (Sandbox Code Playgroud)

问题是我必须为每个模块执行此操作,但不要认为我需要这样做.

我尝试了以下操作,因为这是我想做的事情:

concat: {
    modules: {
        files: [{
            expand: true,
            cwd: "src/js/modules",
            src: "**/*.js",
            dest: "dev/js/modules",
            ext: ".min.js"
        }]
    }
}
Run Code Online (Sandbox Code Playgroud)

但结果是我的所有文件和目录结构都从src /移到了dev /.我基本上用concat做副本,没用. …

gruntjs grunt-contrib-concat

19
推荐指数
1
解决办法
1万
查看次数

单元测试Angular 2 authGuard; 间谍方法没有被调用

我正在尝试对我的auth警卫服务进行单元测试.从这个答案我能够做到这一点,但现在当我为此进行单元测试时,它说Expected spy navigate to have been called.

如何让我的间谍路由器this.router在服务中使用?

AUTH-guard.service.ts

import { Injectable } from '@angular/core';
import { Router, CanActivate } from '@angular/router';

@Injectable()
export class AuthGuardService {

  constructor(private router:Router) { }

  public canActivate() {
    const authToken = localStorage.getItem('auth-token');
    const tokenExp = localStorage.getItem('auth-token-exp');
    const hasAuth = (authToken && tokenExp);

    if(hasAuth && Date.now() < +tokenExp){
      return true;
    }
    this.router.navigate(['/login']);
    return false;
  }
}
Run Code Online (Sandbox Code Playgroud)

AUTH-guard.service.spec.ts

import { TestBed, async, inject } from '@angular/core/testing';
import { RouterTestingModule } …
Run Code Online (Sandbox Code Playgroud)

unit-testing angular2-routing angular2-testing angular

6
推荐指数
1
解决办法
7406
查看次数

为什么angular cli不包括我的组件scss?

我正在使用:

  • Angular v2.3.1
  • Angular CLI v1.0.0-beta.24
  • 节点v6.9.2
  • Node-sass v4.1.1

我有一个新的Angular CLI项目,尽管main.bundle.js文件中显示了组件样式,也没有加载组件样式,并且没有抛出任何路径错误(不再)。

angular-cli.json文件具有defaults.styleExt: "scss"apps.styles: ["styles.scss","path/to/bootstrap.css"]defaults.inline样式和模板均为假。

全局和Bootstrap样式正在加载,但组件中没有加载。

目录结构

|- src
  |- index.html
  |- styles.scss
  |- scss
    |- _colors.scss
    |- _modals.scss
    |- _overrides.scss
    |- _utils.scss
  |- app
    |- components
      |- app-header
        |- app-header.component.ts
        |- app-header.component.html
        |- app-header.component.scss
    |- pages
    |- app-routing.module.ts
    |- app.component.ts
    |- app.module.ts
Run Code Online (Sandbox Code Playgroud)

styles.scss

@import './scss/_colors';
@import './scss/_overrides';
@import './scss/_utils';
@import './scss/_modals';

html, body {
  width: 100%;
  height: 100%;
  font-family: 'Roboto', …
Run Code Online (Sandbox Code Playgroud)

javascript sass angular-cli

5
推荐指数
1
解决办法
2732
查看次数