小编dnd*_*ndr的帖子

在app.config中注入服务

我想在app.config中注入一个服务,以便在调用控制器之前检索数据.我试过这样的:

服务:

app.service('dbService', function() {
    return {
        getData: function($q, $http) {
            var defer = $q.defer();
            $http.get('db.php/score/getData').success(function(data) {
                defer.resolve(data);            
            });
            return defer.promise;
        }
    };
});
Run Code Online (Sandbox Code Playgroud)

配置:

app.config(function ($routeProvider, dbService) {
    $routeProvider
        .when('/',
        {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                data: dbService.getData(),
            }
        })
});
Run Code Online (Sandbox Code Playgroud)

但我得到这个错误:

错误:未知提供程序:来自EditorApp的dbService

如何纠正设置并注入此服务?

angularjs

168
推荐指数
6
解决办法
13万
查看次数

Angular JS:ng-show中的绑定不起作用

我有一个指令和一个控制器:

app.directive('responseBox', function(){
return {
    restrict: 'E',
    transclude: true,
    templateUrl: 'responseBox.html',
    link: function(scope, element, attrs) {
        element.bind("click", function () {
            scope.toggle();
        })
    }
}});
Run Code Online (Sandbox Code Playgroud)

和一个控制器:

app.controller('responseBoxCtrl', function($scope) {
$scope.opened = false;
$scope.toggle = function() {
    $scope.opened = !$scope.opened;
    console.log($scope.opened);
}});
Run Code Online (Sandbox Code Playgroud)

responseBox.html:

<div class="promptBlockResponse" ng-transclude>
<div class="btn-toolbar" style="text-align: right;">
    <div class="btn-group" ng-show="opened">
        <a class="btn btn-link" href="#"><i class="icon-pencil icon-white"></i></a>
        <a class="btn btn-link" href="#"><i class="icon-remove icon-white"></i></a>
    </div>
</div>          
Run Code Online (Sandbox Code Playgroud)

并在主html文件中:

<response_box ng-controller="responseBoxCtrl"></response_box>
Run Code Online (Sandbox Code Playgroud)

我希望btn-group显示何时打开的变量为true.当我单击responseBox时,我可以看到变量切换,但是btn-group不显示/隐藏.我错过了什么?

javascript angularjs

11
推荐指数
2
解决办法
3万
查看次数

在Angular JS中没有调用Promise回调

如果我把connectdoStuff,我得到的消息"套接字连接",但callback不叫.我在这里错过了什么?

 $scope.connect = function() {
    var defer = $q.defer();
    ws = new WebSocket("ws://server.com:port");
    ws.onopen = function(){  
        console.log("Socket connected");
        defer.resolve("socket connected");
    };
    return defer.promise;
}

$scope.doStuff = function() {
    $scope.connect().then(function(data) {
        console.log("And we're off!", data);
    });
}
Run Code Online (Sandbox Code Playgroud)

websocket jquery-deferred angularjs

10
推荐指数
2
解决办法
9773
查看次数

部署后清除模板缓存

我想确保我的用户在部署后看到我的Angular应用程序的最新版本.在这种情况下清除模板缓存的正确策略是什么?

我读的地方,你可以做$templateCache.removeAll()app.run,但是这将禁用缓存完全,我认为?

angularjs

10
推荐指数
1
解决办法
4855
查看次数

在Ionic 2应用程序中使用Crosswalk清空麦克风数据

在我的Ionic 2应用程序中,我使用WebAudio API来录制音频(基于 https://github.com/mattdiamond/Recorderjs).这适用于Chrome,并且在将正确的权限放入以下内容之后AndroidManifest.xml:

<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
Run Code Online (Sandbox Code Playgroud)

cordova.plugins.diagnostic在Android版本6.0.1(三星Galaxy S6)上通过插件请求麦克风访问.

但是,它在Android 4.2.2(三星Galaxy S4)上不起作用,因为它似乎不支持getUserMedia,所以我决定安装crosswalk插件:

ionic plugin add cordova-plugin-crosswalk-webview

之后,我看到getUserMedia可以使用(通过Modernizr检查).但是,现在录音机只返回静音(在两个版本的Android上).我已检查权限是否仍然正确设置.知道什么可能是错的吗?

android getusermedia crosswalk-runtime crosswalk-project crosswalk

8
推荐指数
1
解决办法
329
查看次数

Angular 2服务中的Observables与变量

我有一个关于在Angular 2服务中使用Observables与变量的问题.前者似乎是首选方式,但我无法确切地找出原因.

给出如下样本服务:

@Injectable()
export class TestService {
    // Method 1
    public data = {x: Math.random(), y: Math.random()};

    // Method 2
    private _data$:BehaviorSubject<any> = new BehaviorSubject({x: Math.random(), y: Math.random()});
    public data$:Observable<any> = this._data$.asObservable();

    constructor() {
        setInterval(() => {
            this.data = {x: Math.random(), y: Math.random()};
            this._data$.next({x: Math.random(), y: Math.random()});
        }, 500);
    }
}
Run Code Online (Sandbox Code Playgroud)

我已经看到了两种消耗组件数据的方法.只是直接使用变量:

<pre>{{testService.data | json}}</pre>
Run Code Online (Sandbox Code Playgroud)

并使用Observable:

<pre>{{(testService.data | async) | json}}</pre>
Run Code Online (Sandbox Code Playgroud)

两者似乎都有效,那么使用更精细的基于Observable的方法有什么优势呢?

Plunker:https://plnkr.co/edit/1qVDSZwq2NVgZsWFPnii ? p = preview

observable rxjs angular

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

使用 ng-if/ng-show/ng-switch 的角度条件显示简要显示这两个元素

我想根据布尔值显示元素 A 或 B,但是当值切换时,使用 ng-if 简要显示两个元素:

<div ng-if="a"></div>
<div ng-if="!a"></div>
Run Code Online (Sandbox Code Playgroud)

当我使用 ng-show/ng-hide 时也会发生这种情况:

<div ng-show="a"></div>
<div ng-hide="a"></div>
Run Code Online (Sandbox Code Playgroud)

甚至 ng-switch:

<div ng-switch="a || 'false'">
   <div ng-switch-default></div>
   <div ng-switch-when="false"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

有没有办法强制同时显示这些元素中的一个,或者这是不可能的?

javascript angularjs

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

在TypeScript中扩展Parse SDK对象

为了为angular2中的Parse对象定义简单的getter和setter方法,我想像下面这样扩展Parse.Object:

const Parse = require('parse').Parse;

export class Test extends Parse.Object {

    constructor() {
        super('Test');
    }

    get items():Array<string> {
        return super.get('items');
    }

    set items(value:Array<string>) {
        super.set('items', value);
    }
}

Parse.Object.registerSubclass('Test', Test);
Run Code Online (Sandbox Code Playgroud)

但是,出现以下错误:

error TS2507: Type 'any' is not a constructor function type.

parse-platform typescript angular

5
推荐指数
0
解决办法
298
查看次数

基于泛型类型的可选属性

我想根据泛型类型使属性可选。我尝试了以下方法:

interface Option<T extends 'text' | 'audio' | 'video'> {
    id: string;
    type: T;
    text: T extends 'text' ? string : undefined;
    media: T extends 'audio' | 'video' ? T : undefined;
}

const option: Option<'text'> = { text: "test", type: "text", id: "opt1" };
Run Code Online (Sandbox Code Playgroud)

所以这个想法是属性textonly 被定义为Option<'text'>并且media只被定义为Option<'audio' | 'video'>

但是,ts 编译器给了我以下错误:

Property 'media' is missing in type '{ text: string; type: "text"; id: string; }' 
but required in type 'Option<"text">'.ts(2741)
Run Code Online (Sandbox Code Playgroud)

我该如何解决这个问题?

typescript typescript-generics

2
推荐指数
2
解决办法
142
查看次数