小编ant*_*oom的帖子

带有不可编辑内容的富文本,angularjs

当我需要在富文本中添加不可编辑的html时,我使用指令textAngular来格式化我的电子邮件通知文本并坚持使用任务.我在textAngular指令上添加了我的自定义指令.在我的自定义指令的帮助下,我将字符串中的特殊字符替换为带有param的html span标签contenteditable='false',但此参数不起作用且内容仍可编辑.

在这种情况下,我有两个问题:

  1. 如何在内容textAngular指令中设置不可编辑的html?
  2. 如何将我的变量连接到欲望位置的字符串(当前它总是连接到字符串的末尾)

我感谢任何帮助.

偷偷摸摸我的问题

我的自定义指令:

app.directive('removeMarkers', function () {

return {
    require: "ngModel",
    link: function (scope, element, attrs, ngModel) {

       element.bind('click', function (e) {
                var target = e.target;
                var parent = target.parentElement;
                if (parent.classList.contains('label-danger')){
                    parent.remove()
                }
            });

        function changeView(modelValue){
            modelValue= modelValue
                .replace(/\{{/g, "<span class='label label-danger' contenteditable='false' style='padding: 6px; color: #FFFFFF; font-size: 14px;'>")
                .replace(/\}}/g, "<span contenteditable='false' class='remove-tag fa fa-times'></span></span>&nbsp;");
            ngModel.$modelValue= modelValue;

            console.log(ngModel)
            return modelValue;
        }
        ngModel.$formatters.push(changeView);
        }
    }
});
Run Code Online (Sandbox Code Playgroud)

HTML

  <select class="form-control pull-right" …
Run Code Online (Sandbox Code Playgroud)

html javascript angularjs textangular

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

属性'http'在类型'Component',Angular 2上不存在

我是angular2和打字稿的新手,已经花了半天的时间来弄清楚ng2表格.我已完成所有路线并构建了所有必要的表格,目前正在尝试了解如何使用打字稿在angular2中发布

这是我的错误:

[default]中的错误simpleapp/src/app/clients/add-client/add-client.component.ts:52:16属性'http'在'AddClientComponent'类型中不存在.

而且我找不到这个问题来自哪里.我已经angular/http在我的组件中导入了,我提供了标题和响应作为官方教程说但仍然可以看到这个问题.我错过了什么,我的问题在哪里?提前致谢

这是我的组成部分:

import 'rxjs/add/operator/map';

import {Component} from '@angular/core';
import {Http, Response, RequestOptions, Headers} from '@angular/http';

import {Employee} from "./model/add-client.model";

@Component({
  selector: 'app-add-client',
  templateUrl: 'add-client.component.html',
  styleUrls: ['add-client.component.css']
})

export class AddClientComponent {

   departments: Array<any>;
   firstName: '';
   lastName: '';
   id: null;
   salary: null;
   phone: null;
   departmentId: null;

  constructor(http: Http) {
    http.get('api/departments')
      .map((res: Response) => res.json())
      .subscribe((departments: Array<any>) => this.departments = departments);
  }

  model = new Employee(
    this.id,
    this.firstName,
    this.lastName,
    this.salary,
    this.departmentId,
    this.phone
  );

  submitted = …
Run Code Online (Sandbox Code Playgroud)

forms typescript angular2-http angular

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

NgRX 存储选择返回存储状态而不是数据

我正在尝试将 ngrx v4 实施到我的 angular 项目中,并且正在努力从 ngrx 存储中获取数据。我根据github 页面上提供的 api 文档编写了 Actions、Reducer 和 Effects,在我看来一切都是正确的,但我得到的不是数据,而是像这样的存储状态:

在此处输入图片说明

因此,如果有人可以帮助我找出我的错误所在,我将不胜感激。提前致谢。我的代码如下

接口.ts

export interface Category {
  id?: number;
  name: string;
  used: boolean;
}
Run Code Online (Sandbox Code Playgroud)

动作.ts

import { Action } from '@ngrx/store';
import {Category} from '../categories';

export const GET_CATEGORIES  = '[Category] Get data';
export const GET_CATEGORIES_ERROR = '[Category] Get data error';
export const GET_CATEGORIES_SUCCESS  = '[Category] Get data success ';

export class GetCategories implements Action {
  readonly type = GET_CATEGORIES;
}
export class GetCategoriesError implements Action …
Run Code Online (Sandbox Code Playgroud)

ngrx angular ngrx-store

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

angular 5 和 quilljs [羊皮纸] 无法创建污点

我正在使用primeng编辑器,编辑器本身没有任何问题,但是我连续两天都在为自定义标签扩展标准块而奋斗,官方文档说使用quilljs api的任何附加功能

我已经检查了 github 上的每个 api 和问题,在我看来,我走在正确的道路上,但我无法摆脱这个烦人的错误:

ERROR Error: [Parchment] Unable to create marker blot
at new ParchmentError (scripts.bundle.js:148)
at Object.create (scripts.bundle.js:178)
at BlockBlot.insertAt (scripts.bundle.js:7323)
at Block.insertAt (scripts.bundle.js:855)
at Scroll.ContainerBlot.insertAt (scripts.bundle.js:3404)
at ScrollBlot.insertAt (scripts.bundle.js:7060)
at Scroll.insertAt (scripts.bundle.js:4252)
at Editor.insertEmbed (scripts.bundle.js:2606)
at scripts.bundle.js:1379
at Quill.modify (scripts.bundle.js:1610)
Run Code Online (Sandbox Code Playgroud)

我想要实现的是添加带有不可编辑内容的自定义标签。这是我的代码:

...
import {Editor} from 'primeng/editor';

import * as Quill from 'quill';
import * as Parchment from 'parchment';
const Block = Quill.import('blots/block/embed');
class BlockEmbed extends Parchment.default.Embed {}
BlockEmbed.prototype = Block.prototype;

export …
Run Code Online (Sandbox Code Playgroud)

typescript quill angular

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

Angular 7,命名路由器插座在延迟加载模块中不起作用

所以我面临着著名的角度路由问题“带有延迟加载模块的命名插座”。这个问题似乎已经结束,这个人提供了一个可行的解决方案,我一直在关注。但是我仍然收到错误并且无法理解这个问题的本质

错误:无法匹配任何路由。网址段:

我尝试使用 pathMatch: 'full' 和不同的重定向路由到不同的组件,但最终总是得到相同的错误。

我已经被困了几个小时,这就是为什么决定在这里提问。我的问题在哪里,我缺少什么?

我的设置

app.routing.ts:

 const routes: Routes = [
      {
        path: '',
        loadChildren: 'app/home/home.module#HomeModule',
      },
      {
        path: 'admin',
        loadChildren: 'app/admin/admin.module#AdminModule',
      },
      {
        path: 'data',
        loadChildren: 'app/data/data.module#DataModule',
      },
      {
        path: '**',
        redirectTo: ''
      }
    ];
Run Code Online (Sandbox Code Playgroud)

应用程序组件.html

<app-header></app-header>
<router-outlet></router-outlet>
Run Code Online (Sandbox Code Playgroud)

data.routing-module.ts

    const routes: Routes = [
  {
    path: 'summary',
    component: SummaryComponent,
    canActivate: [AuthGuard],
  },
  {
    path: 'management/:id',
    component: DataComponent,
    canActivate: [AuthGuard],
    children: [
      {
        path: 'activities',
        component: ActivitiesComponent,
        outlet: 'activities',
      },
      {
        path: 'researches', …
Run Code Online (Sandbox Code Playgroud)

typescript angular-routing angular

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

无法解析AuthenticationService的所有参数:([object Object],?,[object Object])

我遇到了下一个错误,无法理解如何解决它.

无法解析AuthenticationService的所有参数:([object Object],?,[object Object])

我已经检查了几乎每个主题,并尝试了多种方法来解决它,但仍然无法在第二天击败它.

我试图像这样在appService中注入第一个authService但是得到了同样的错误

@Inject(forwardRef(() => AuthenticationService)) public authService: AuthenticationService
Run Code Online (Sandbox Code Playgroud)

我检查了所有DI和服务内部的导入顺序,在我看来一切都是正确的

如果有人可以帮我处理它,我感激不尽.

Angular 4.0.0

AuthService

    import { Injectable } from '@angular/core';
import {Http, Headers, Response} from '@angular/http';
import 'rxjs/add/operator/toPromise';
import {Observable} from 'rxjs/Rx';

import {AppServices} from "../../app.services";
import {Router} from "@angular/router";

@Injectable()
export class AuthenticationService {
  public token: any;

  constructor(
    private http: Http,
    private appService: AppServices,
    private router: Router
  ) {
    this.token = localStorage.getItem('token');
  }

  login(username: string, password: string): Observable<boolean> {
    let headers = new Headers();
    let body …
Run Code Online (Sandbox Code Playgroud)

typescript angular2-services angular

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

未捕获的RangeError:超出了最大调用堆栈大小。jstree

我收到此错误,不知道如何解决

未捕获的RangeError:超出最大调用堆栈大小

我正在尝试使用jstree lib构建树。数据来自两个不同的http调用。我得到这样的初始数据:

           $scope.treeFolders = [];
        $scope.treeFilters = [];
        $scope.tree = [];
    var folders = function () {
        $http.get("folders.json")
        .success(function (res) {
                    angular.forEach(res, function(parent){
                      // console.log(parent)
                        if(!("parent" in parent)){
                          parent.parent = "#"
                        }
                    })

                     $scope.treeFolders = res
                     console.log($scope.treeFolders)
                });
        };
        folders();

    var filters = function(){
            $http.get("child.json")
               .success(function (res) {
                    angular.forEach(res, function(obj){
                        if(!("parent" in obj)){
                          // console.log(obj.folderId)
                            obj.parent = obj.folderId;
                        }
                        // console.log(obj)
                    });

                    $scope.treeFilters = res;
                    console.log($scope.treeFilters)

                });
    };
  filters();
Run Code Online (Sandbox Code Playgroud)

console.log返回数组,现在一切都很好。然后我使用函数加载将两个数组合并为一个超级数组

    $scope.load = function(){
    // method 1
            $scope.tree = …
Run Code Online (Sandbox Code Playgroud)

javascript arrays jstree angularjs

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

如何从日期格式angularjs中删除单词

我试图找到一种方法来从角度和日期格式中删除日期格式的单词:2016-12-23 23:59 GMT.当我使用下一个代码时

'date:"yyyy-MM-dd HH:mm":"GMT"'
Run Code Online (Sandbox Code Playgroud)

角度显示日期没有任何问题,但没有单词GMT.但是,我试图传递一个单词"GMT"并逃避它,

'date:"yyyy-MM-dd HH:mm":"GMT" \"GMT\"'
Run Code Online (Sandbox Code Playgroud)

我收到语法错误.

这个日期格式我用作我的ui网格的 cellFilter 并从控制器设置.这是我的问题的吸引力

我的错误在哪里?

javascript angularjs

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

使用角度文件保护程序下载大文件

我已经在我的项目中实现了角度文件保护程序,目的是下载文件,它对于小文件也可以正常工作,但是对于大于50mb的文件,我看到下一个错误,并且在35-50mb之后停止下载。

net::ERR_INCOMPLETE_CHUNKED_ENCODING
Run Code Online (Sandbox Code Playgroud)

我试图调查互联网上的这个问题,发现下载限制为500mb,因为显然不能在RAM中存储太多信息。不幸的是,我没有找到其他任何可以解决此问题的解释,然后我问了后端人员,我得到的答案是,一切都很好。

那我的问题在哪里呢?以及如何解决此问题?感谢您的帮助

这是我的代码的一部分:

服务

 function attachment(obj) {
        custom.responseType = "arraybuffer";
        delete  custom.params.limit;
        delete  custom.params.offset;
        delete  custom.params.orderBy;
        delete  custom.params.insertedAt;

        var contentType = obj.mimeType;
        var name =  obj.displayFilename;

        return $http.get(Config.rurl('attachments') + '/' + obj.bucketName + '/' + obj.path + '?displayFilename=' + obj.displayFilename, custom)
            .then(function (response) {
                var data = new Blob([response.data], { type: contentType });
                FileSaver.saveAs(data, name);
                delete custom.responseType
            })
            .catch(function (err) {
                delete custom.responseType;
                alert("It has happened an error. Downloading has been stopped") ;
            });
    }
Run Code Online (Sandbox Code Playgroud)

控制器功能 …

javascript html5 blob angularjs filesaver.js

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

使用material2 snackbar作为angular2的错误处理程序

我正在尝试将material2中的snackbar设置为angular2服务的错误捕获器.在我看来,我做的一切都是正确的,但仍然出错

EXCEPTION:未捕获(在promise中):TypeError:无法读取未定义的属性'notify'TypeError:无法读取未定义的属性'notify'

这是我与捕手的服务:

import { Injectable } from '@angular/core';
import {Headers, Http, RequestOptions} from '@angular/http';

import 'rxjs/add/operator/toPromise';
import {Observable} from 'rxjs/Rx';
import {MdSnackBar, MdSnackBarConfig, MdSnackBarRef} from '@angular/material';

@Injectable()

export class AppServices {

  private api = 'app/endpoint';
  private headers = new Headers({ 'Content-Type': 'application/json' });
  private options = new RequestOptions({ headers: this.headers });

  constructor(
    private http: Http,
    private snackbar: MdSnackBar
  ) { }

  getConfigs(): Promise<any> {
    return this.http
      .get(this.api + "/confs")
      .toPromise()
      .then(response => response.json() as Array<Object>)
      .catch(this.handleError)
  }

  // ============== …
Run Code Online (Sandbox Code Playgroud)

material-design angular

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