标签: angular7

我正在尝试将数据传递到我的 ng-bootstrap 工具提示模板。按照此示例https://ng-bootstrap.github.io/#/components/tooltip/examples#tplwithcontext，我现在坚持添加该#t1="ngbTooltip"部分。因为我的元素是通过迭代数组创建的，所以我无法手动添加 #t1 部分。

这是我最好的尝试：

https://stackblitz.com/edit/ngbs-tooltip-dyn

当将鼠标悬停在“cell *”表格单元格之一上时，我希望工具提示使用来自tooltipData. 如有任何考虑和帮助，我们将不胜感激。

我正在创建一个 Angular 7 应用程序，它利用 Jira 问题收集器将问题直接提交到各自的项目。

当我按照现在的方式构建应用程序时，什么也没有发生。当我直接将代码从方法“submitIssue”移动到“ngOnInIt”下时，会出现问题收集器对话框。代码片段应该添加到哪里？

任何帮助将不胜感激。谢谢你！

Jira 代码片段示例

// Requires jQuery!
jQuery.ajax({
    url: "https://<domain>.atlassian.net/s/_/download/batch/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector/com",
    type: "get",
    cache: true,
    dataType: "script"
});

 window.ATL_JQ_PAGE_PROPS =  {
    "triggerFunction": function(showCollectorDialog) {
        //Requires that jQuery is available! 
        jQuery("#myCustomTrigger").click(function(e) {
            e.preventDefault();
            showCollectorDialog();
        });
    }};

这是我的数组，它在问题收集器组件上填充了不同项目和按钮的卡片。

数据库数据.ts

export const PROJECTS: any = [

    {
        id: 1,
        title: 'Project Title',
        /** The url is taken directly from the issue collector section within the Jira project. Link below is modified
         * for security purposes. */
        url: 'https://<domain>.atlassian.net/s/_/download/batch/com.atlassian.jira.collector.plugin.jira-issue-collector-plugin:issuecollector/com' …

我有一个名为“host”的模块，它有自己的路由，我想将其插入到 app-routing.module 中。但是，我遇到了首先加载通配符并显示 PageNotFoundComponent 的问题，而不是加载 Host 组件。我有以下文件。

主机模块.ts

....
const routes: Routes = [
  {
    path: 'host',
    children: [
     { path: '', component: HostComponent }
    ]
  }
];

@NgModule({
  declarations: [HostComponent],
  imports: [
    CommonModule,
    RouterModule.forChild(routes)
  ]
})
export class HostModule { }

应用程序路由.module.ts

const routes: Routes = [
  { path: '', component: HomeComponent, pathMatch: "full"},
  { path: '**', component: PageNotFoundComponent }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

应用程序模块.ts

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    PageNotFoundComponent …

我正在尝试将自定义验证器添加到我的 component.ts 中

自定义验证器文件：

import { FormGroup, ValidationErrors } from '@angular/forms';

export class ProfileCustomValidators {

    static validateTime(fg: FormGroup): ValidationErrors {
        const staffForm = fg.get('staffForm')
        const fromTime = staffForm.get('fromTime').value;
        const toTime = staffForm.get('toTime').value;
        if(fromTime > toTime) {
            return {
                'endTime': {
                    message: 'End time should be greater than start time'
                }
            }
        }
        return null;
    }
}

组件.ts

export class StaffFrom implements onInit {
staffForm: FormGroup;

constructor(private fb: FormBuilder){}


ngOnInit() {
  this.staffForm = this.fb.group({
      fromTime: new FormControl(null, Validators.required),
      toTime: new FormControl(null, …

我如何告诉 Angular 在 http 调用之前忽略一个或多个字段；就像@JsonIgnorejava中的一样。

例子：

我有这个对象：{id: 1, libelle: 'test', mustIgnore: 'test'};

我希望这个对象是：{id: 1, libelle: 'test'}；

我尝试过delete object.field，但我正在寻找一种更简单的方法来做到这一点，例如在我的对象上使用注释。

因为如果我有一个对象数组，管理它就会变得更加困难。

编辑 ：

我不想为每个对象手动执行此操作！有没有一种方法可以指定我想要删除的字段，并在每当我有一个具有不同字段的不同对象要删除时自动执行此操作

我引用了以下链接，仅在登录后启用注销按钮 https://stackblitz.com/edit/angular-login-hide-navbar-ngif

我只想在用户登录时在导航栏中显示“注销”，我通过从“身份验证服务”调用“this.authservice.isUserLoggedIn”并将其分配给变量并写入来验证用户是否已登录ngif“注销”链接附近的情况。我已经使用 BehaviourSubject 来获取当前状态。但我不知道为什么代码不起作用，它总是返回 false，因此即使用户登录后也不会启用“注销”链接

我有 header.component.ts

export class CommonheaderComponent implements OnInit {

  constructor(private authservice : AuthenticationService) { }
  isLoggedIn$ : Observable<boolean>;
  ngOnInit() {
    this.isLoggedIn$ = this.authservice.isUserLoggedIn;
  }
  }

我有 header.component.html 如下

<ul class="nav navbar-nav">
      <li><a [routerLink]='["/search"]'>Search <span class="slider"></span></a></li>
      <li *ngIf="isLoggedIn"><a (click)="logout()">Logout</a></li>
  </ul>

下面是login.component.ts

export class LoginComponent implements OnInit {
  isLoggedIn : Observable<boolean>;

 ngOnInit() {
   this.isLoggedIn = this.authservice.isUserLoggedIn;
   this.loginForm = this.formbuilder.group({
    username : ['', Validators.required],
    password : ['', Validators.required]
  })
 }

}

  onSubmit(){
    this.authservice.login(this.loginForm.value).subscribe(data => {
  }) …

我有两个选项可以滚动到页面顶部。第一的，

router.events.subscribe((evt) => {
    if (evt instanceof NavigationEnd) {
        window.scroll({
            top: 0,
            left: 0,
            behavior: 'smooth'
        });
    }
});

Angular 6 提供的第二个选项是，

RouterModule.forRoot(AppRoutes, { 
      scrollPositionRestoration: "enabled"
})

当我更改路线时，页面将移动到顶部，并且按预期工作。我在页面的几乎底部有使用子路线的选项卡部分。当子路由被触发时，页面将移动到页面顶部，而不是保留在选项卡部分。

所以我需要禁用子路线上的滚动到顶部功能。有什么办法可以做到吗？

任何帮助/想法表示赞赏。

我正在使用 Angular 7。我编写了一个真正简单的测试类，src/app/pastebin.ts，

export class Pastebin {
    id: number;
    title: string;
    language: string;
    paste: string;

    constructor(values: Object = {}) {
        Object.assign(this, values);
  }
}

export const Languages = ["Ruby","Java", "JavaScript", "C", "Cpp"];

然后一个真正简单的 Jasmine 规范 src/app/pastebin.spec.ts 来测试它，

/* pastebin.spec.ts */

//import the Pastebin class
import { Pastebin } from './pastebin';

describe('Pastebin', () => {
    it('should create an instance of Pastebin',() => {
        expect(new Pastebin()).toBeTruthy();
    });

})

但是当我去运行测试时，我收到一些错误，看起来像是与我所做的事情相关的任何错误......

localhost:Pastebin davea$ ng test
 10% building modules 1/1 modules 0 active30 08 2019 …

这是父组件。添加了一个子组件并传递了表单。这里同时使用表单控件名称和 NgModel（这是最佳实践吗）。加载页面控制台时出现错误“ngModel 无法用于向父 formGroup 指令注册表单控件。”

<div class="inner-wrapper">   
    <form [formGroup]="form">
     <pat-demo-information [group]="form"></pat-demo-information>
     <div class="panel-body">
        <div class="row">
            <div class="col-lg-2 col-md-3 col-sm-3">
                <div class="ui-input-group">
                    <input type="text" maxlength="15" class="form-control" [(ngModel)]="notif.en.No" formControlName="epiNo">
                    <span class="input-bar"></span>
                            <label>No.</label>
                 </div>
            </div>
        </div>
     </div>  
</div>
</form>
</div>

这是子组件

@Component({
  selector: 'patient-demographic-information',
  templateUrl: './pat-demo-information'
})
export class PatDemoInfoComponent implements OnInit {

    @Input() patientForm: FormGroup
    noti: MaltreatmentNoti;


  instid: number;
  instPatientid: number;
  latitude: number;
  longitude: number;

  enMpi: Mpi = new Mpi();

  constructor(private formBuilder: FormBuilder) {

  }

  ngOnInit() {
    this.notification = new MaltreatmentNoti();
    this.notification.enMpi …

我的组件有以下服务：

@Injectable({
  providedIn: 'root',
})
export class MyService {
    constructor(private httpClient: HttpClient ) { }
}
someFunction() {
   this.httpClient.post(url, data, options)
}

我也有一个HttpInterceptor像下面这样的：

@Injectable({
  providedIn: 'root'
})
export class HttpInterceptorService implements HttpInterceptor {
  constructor() {}

  intercept(
    req: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    return next.handle(req).do(
      (event: HttpEvent<any>) => {
        if (event instanceof HttpResponse) {
          console.log('############### event status: ', event.status);
        }
        console.log('########### event is: ', event);
      },
      (err: any) => {
        if (err instanceof HttpErrorResponse) {
          console.log('HTTP error status …