小编Max*_*ket的帖子

使用Typescript 1.8,Gulp 3.9.0,gulp-sourcemaps 1.6.0和tsconfig.json文件.

很久以前,这一点工作得很好.最近(我无法确定何时),Chrome和Firefox都不会实际使用源图.

我在Chrome上启用了源图,并认识到有一个源图,告诉我在控制台中:

"检测到源映射.应将相关文件添加到文件树中.您可以将这些已解析的源文件调试为常规JavaScript文件.可通过文件树或Ctrl + P获取关联文件."

但是,源文件无法通过任何一种方法获得.

在本地构建上构建文件结构(仅使用Login作为示例):

build
  |- resources
      |- js
         |- app.js
         |- app.js.map
         |- typescript
              |- app.ts
              |- sections
                    |- login
                         |- LoginService.ts
                         |- LoginDirective.ts
                         |- LoginController.ts

但是,Chrome只在文件树中显示:

build
  |- resources
      |- js
         |- app.js

而已.没有Typescript文件夹,没有文件.Ctrl-P也找不到它们.因此,当我调试时,我只能调试已编译的app.js文件,而不是查看Typescript代码.

我的gulp文件相关部分:

var ts = require( 'gulp-typescript' ); // compiles typescript
var tsProject = ts.createProject( 'tsconfig.json' );

gulp.task( 'compile:typescript', function () {
    var tsResult = tsProject
        .src() // …

我有(虽然是次要的)问题$routeProvider.

http:// localhost/thisapp /工作正常,并重定向到.otherwise()完美.但似乎一旦应用程序加载并登陆"home"url(http:// localhost/thisapp /#/)

然后就打破了.

如果我导航到http:// localhost/thisapp,则$location解析为http:// localhost/thisapp /#/

如果我刷新(因为你知道用户会这样做),那么代码就会中断

我尝试过使用$locationProvider但是更令人困惑.似乎我读的越多,我就越困惑,因为记录的内容似乎不起作用.(如果我取消注释下面的$locationProvider行,则不会生成任何内容).我已经查看了StackOverflow上的各种教程和问题,但是看起来并没有起到应有的作用.

这是我的配置代码:

myApp.config(function($routeProvider, $locationProvider) {

    // commented cuz it's not working 
    // $locationProvider.html5Mode(true);

    $routeProvider
        .when('/', {
            templateUrl: 'app2/components/templates/overview.html',
            controller: 'overviewController'
        })
        .when('/all_overview', {
            templateUrl: 'app2/components/templates/overview.html',
            controller: 'overviewController'
        })
        .when('/all_procurement', {
            templateUrl: 'app2/components/templates/procurement.html',
            controller: 'procurementController'
        })
        .when('/all_social', {
            templateUrl: 'app2/components/templates/social.html',
            controller: 'socialController'
        })
        .when('/all_strengthening', {
            templateUrl: 'app2/components/templates/strengthening.html',
            controller: 'strengtheningController'
        })
        .when('/all_sales', {
            templateUrl: …

我尝试在本地站点,托管网站上,甚至在Angular站点上使用它,我得到的只是带有Angular的HTML列表.没有范围,没有模型,没有任何用处.我认为它应该有助于在Chrome中使用Angular开发,但是,没有.

有人找到了这个理由吗？

运用

Chrome版本39.0.2171.71 m AngularJS v1.2.26 AngularJS Batarang 0.7.4

尝试对返回的 Observable.subscribe() 数据的数组进行排序...这是 Angular 7 的新功能。我对如何在此处使用 RXJS 方法、我需要在哪里导入什么以及如何对 Event 类型的数组进行排序感到困惑。

事件.ts

import {Venue} from './Venue';

export class Event {
  id: number;
  url: string;
  date: string;
  venue_id: number;
  venue: Venue;
}

事件结果对象.ts

import {Event} from './Event';

export interface EventResultObj {
  count: number;
  next?: any;
  previous?: any;
  results: Event[];
}

事件服务.ts：

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Event } from '../models/Event';
import {Observable} from 'rxjs';
@Injectable({
  providedIn: 'root'
})
export class EventsService { …

Stack: Typescript 1.7 + Angular 1.49

摘要:

我有一个指令.我想要$inject棱角分明的$timeout服务.它在指令的控制器功能中工作正常,但在链接功能中没有.我错过了什么？

问题:

• 我做错了什么？
• 是否有更好$inject的$timeout依赖方式？
• 为什么$timeout服务在指令的控制器中工作而不是链接？

MyDirective.ts:

module app.directives {

    export class MyDirective {
        priority = 0;
        restrict = 'E';
        templateUrl = 'template.html';
        scope = {
            'items': '='
        };
        controller = MyController;
        link = MyLink;

        static $inject = ['$timeout'];

        constructor(private  $timeout:ng.ITimeoutService) {
        }
    }

    function MyController($scope:ng.IScope, $timeout:ng.ITimeoutService) {
        console.log("controller", $timeout); // function timeout(fn,delay,invokeApply){ the guts here }
        $timeout(function () {
            console.log("This works fine");
        },3000); …

在jQuery中,我会做类似的事情:

var mySpan = $('<span/>,{ 'data':'somedata'});

在Angular中,我希望在DOM中的ng-repeat运行时有一个绑定到该数据属性的函数,例如,

<div ng-repeat="item in items"> <span ng-click = "someFunc(somedata)">{{somedata.someprop}}</span> </div>

这样我就可以在基于ul和li的下拉菜单中访问onClick对象了.我假设我这样做是"错误的"(不是Angular)方式,但我看不到它.

我知道我可以在函数中使用jQuery,或者使用angular.element.data()方法,但我似乎无法将该数据发送到函数中!

我更喜欢不将绑定数据显示为html中的data-x,data-y标签.我可以做得很好<el data-x="{{somedata}}"></el>

最终结果,我希望能够调用$(someEl).data()并获取我绑定它的数据对象.

我错过了什么？