小编Loc*_*ost的帖子

Angular 2子应用程序,父/子,嵌套组件,嵌套路由器插座,设计/编码

我有一个Angular 2应用程序.主屏幕(app?)看起来像这样......

主应用程序屏幕

当您单击顶部菜单routerLinks中的项目时,新组件将加载到主视图路由器插座中.其中一个链接加载一个新的"管理"模块/组件,它有自己的路由和新的路由器插座......

管理员应用屏幕

然后当您单击左侧导航栏中的routerLinks时,新的管理组件将加载到新的路由器插座中.

但...

Angular 2不允许超过1个路由器插座.因此,单击左侧导航栏中的任何routerLink只会替换整个初始路由器插座视图.

我已经看到使用"bootstrap"加载后续组件的一些SO帖子(更旧,可能已弃用),但我无法让它工作.我甚至不能import { bootstrap } from 'anywhere at all, nothing works'.所以也许这不是这样做的方式.

如何让Admin子应用程序部分工作?

非常非常感谢您分享您的Angular 2专业知识:-)

编辑:尝试以下建议的解决方案.无论我把路由放在哪里,在基础app.routes.ts或子应用程序admin.routes.ts中,无论我如何格式化routerLinks,我都会收到此错误...

找不到路线

再次编辑:这是路由器和模板中的代码......

<!--
    ============================================================================
    /src/app/component/admin/admin.component.html
-->

<!-- Row for entire page columnar dispaly -->
<div class="row">

    <!-- Column 1: Left navigation, links to all admin components -->
    <div class="col col-md-4">
        <app-admin-nav></app-admin-nav>
    </div>

    <!-- Column 2: Rows of records, click to edit -->
    <div class="col col-md-8">
        <router-outlet name="admin-app"></router-outlet>
    </div>

</div>

// ============================================================================
// /src/app/app.routes.ts

import { ModuleWithProviders …
Run Code Online (Sandbox Code Playgroud)

javascript angular

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

backbonejs collection.fetch错误处理程序

下面骨干collection.fetch代码火灾,由于某种原因,错误,然后跳转到错误处理程序(如预期),但我真的不知道的ErrorHandler PARAMS是什么.错误触发时,模型,xhr和选项参数未定义.我究竟做错了什么?

  var onErrorHandler = function(model, xhr, options) {
      alert(options);
  };

  that.collection = new MembersCollection([]); 
  that.collection.fetch({ success : onDataHandler, error: onErrorHandler, dataType: "jsonp" });
Run Code Online (Sandbox Code Playgroud)

@muistooshort:我完全忘记了js的论点,谢谢你的提示.

这是我发现的......

Arguments[0] = looks like its just the letter "d"
Arguments[1] = is an object. Has readyState, responseText, status, statusText
Arguments[2] = is an object. Exactly the same as [1]
Run Code Online (Sandbox Code Playgroud)

status = 200,文本为"OK".responseText是我期望从PHP服务器模型接收的确切JSON数据.

所以我想现在问题是为什么collection.fetch方法将成功结果发送给错误处理程序?我不相信fetch回调中的那些处理程序的顺序很重要.可以?

error-handling fetch backbone.js

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

Node Express Mocha 测试:TypeError: chai.request is not a function

我有一个 Typscript 应用程序和 API。我根据大量的 Google 搜索以及在 SO 和其他地方找到的一些示例编写了以下测试。我在测试代码中没有看到任何问题。谷歌搜索TypeError: chai.request is not a function,到目前为止让我现在在哪里。你看到我下面的错误了吗?

谢谢,谢谢,谢谢你的帮助:-)

在此处输入图片说明

mocha.js node.js express chai typescript

6
推荐指数
3
解决办法
7220
查看次数

从父组件调用的子组件内的Angular 2 ng2-bootstrap模式

很难解释这一点.我有一个简单的工作ng2-bootstrap模式示例工作.我将它扩展为包含我的主页的Boostrap 4 Jumbotron示例模板,现在ng2-bootstrap模式什么都不做.我可以看到this.childModal.show()in 子模态组件在按钮单击时被调用,但没有任何反应.Chrome控制台中没有错误,也没有模态显示.我不知道下一步该做什么: - /

// ============================================================================
// /src/app/app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { ModalModule } from 'ng2-bootstrap/modal';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

import { AppComponent } from './app.component';
import { DemoModalChildComponent } from './demo-modal-child.component';

@NgModule({
    declarations: [
        AppComponent, DemoModalChildComponent
    ],
    imports: [
        BrowserModule,
        FormsModule,
        HttpModule,
        NgbModule.forRoot(),
        ModalModule.forRoot()
    ],
    bootstrap: [AppComponent]
})
export class …
Run Code Online (Sandbox Code Playgroud)

modal-dialog bootstrap-modal ng2-bootstrap angular

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

打字稿错误:在分配之前使用了属性

打字稿显示[ts]在 VSCode中分配之前使用了属性“记录器”。错误发生在下面的代码中this.logger.logInfo(Important, ...。我很清楚地在构造函数的第二行设置了这个属性,所以......?

如果我使用self代码中显示的var (self.logger.logInfo...),TS 错误就会消失,但这不是必需的。

感谢您分享您的专业知识:-)

// app/data/mongo/_base.data.mongo.ts 

import { MongoClient, ObjectId } from 'mongodb';
import { IBaseModel } from '../../model/_base.model';
import { Logger, Important, NotImportant } from '../../util/logger';

export default class BaseData {

    constructor(params: any) {
        this.collectionName = params.collectionName;
        this.logger = new Logger(this.collectionName);
        if (this.db) {
            this.collection = this.db.getCollection(this.collectionName);
        } else {
            BaseData.userId = params.user.id;
            BaseData.userHandle = params.user.handle;
            this.dbServer = params.dbServer;
            this.dbPort = params.dbPort || '27017';
            this.dbName = params.dbName;
            const …
Run Code Online (Sandbox Code Playgroud)

typescript

4
推荐指数
1
解决办法
8590
查看次数

Google Cloud Firestore:FirebaseError:[code = permission-denied]:缺少权限或权限不足

如果您使用完全开放/允许所有规则,似乎只能使Firestore规则起作用,并从客户端代码调用.add。

这是一个VueJS应用。在我的main.js中...

// You MUST import these 2 lines exactly so
// to get firebase/firestore loaded and working
import firebase from 'firebase';
import 'firebase/firestore';

import config from '../config/firebase.config.json';
firebase.initializeApp(config);

Vue.config.productionTip = false;
// Define some globals: Available to ALL page vues
Vue.prototype.$http = require('axios');
Vue.prototype.$firebase = firebase;
Run Code Online (Sandbox Code Playgroud)

在我的Login.vue中,我有...

methods: {
    loadFirebaseUIAuth() {
        const firebaseUIConfig = {
            'signInSuccessUrl': '/',
            'signInOptions': [
                // Leave the lines as is for the providers you want to offer your users.
                this.$firebase.auth.GoogleAuthProvider.PROVIDER_ID,
                this.$firebase.auth.FacebookAuthProvider.PROVIDER_ID,
                this.$firebase.auth.TwitterAuthProvider.PROVIDER_ID,
                this.$firebase.auth.GithubAuthProvider.PROVIDER_ID
                // …
Run Code Online (Sandbox Code Playgroud)

firebase-security firebase-realtime-database google-cloud-firestore

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