小编Jua*_*uan的帖子

使用Angular 4的Bootstrap 4折叠导航栏

我想使用Bootstrap 4和Angular 2创建一个导航栏,当浏览器的宽度达到某个值时,它会在按钮上折叠他的内容.我实现了这一点,当导航栏崩溃时,我可以看到包含导航栏中元素的按钮,但是这个按钮不起作用.如何在不使用jquery的情况下解决这个问题?我试图使用ng-bootstrap.

在图像中,您可以在导航栏折叠时看到按钮.

在此输入图像描述

我的代码到目前为止:

<nav class="navbar navbar-expand-md fixed-top navbar-dark custom-nav">
  <span class="navbar-brand mb-0 h1">Partes vehículos</span>

  <button class="navbar-toggler" type="button">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse">
    <div class="navbar-nav ml-auto">
      <a class="nav-item nav-link active" *ngIf="authService.isLoggedIn()">
        Usuario: {{ authService.currentUser.name }}
      </a>
      <a class="nav-item nav-link active" *ngIf="authService.isLoggedIn()">
        Perfil: TODO
      </a>
      <button class="nav-item btn btn-outline-warning ml-3 mr-3">Más opciones</button>
      <a class="nav-item nav-link active" routerLink="/" (click)="authService.logout()" *ngIf="authService.isLoggedIn()">
        Salir
        <span class="sr-only">(current)</span>
      </a>
    </div>
  </div>
</nav>
Run Code Online (Sandbox Code Playgroud)

twitter-bootstrap-4 responsive angular

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

使用 Angular 以编程方式设置引导程序表单中的选择字段值

如何以编程方式选择选择字段中的选项之一(基于某些变量)?

这是模板的代码:

<div class="form-group" >
    <label for="selectAction">Action</label>
    <select ngModel name="option" class="form-control" id="selectAction">
        <option *ngFor="let op of options" [value]="op.id">
            {{ op.description }}
        </option>
    </select>
</div>
Run Code Online (Sandbox Code Playgroud)

typescript twitter-bootstrap-4 angular

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

如何在没有 JQuery 的情况下使用 Bootstrap 4 在 Angular 应用程序中实现自动完成输入字段

我想使用 Bootstrap 4 在 Angular 应用程序中实现自动完成输入字段。这是所需的结果:

在此处输入图片说明

基于某些国家/地区的数组,我需要将输入字段中的文本与可能的有效国家/地区进行匹配。

typescript twitter-bootstrap-4 angular

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

ASP.NET 中的 JWT 令牌验证

我正在 ASP.NET 中编写一个 API,它公开了两个端点:一个用于生成 JWT 令牌,另一个用于验证给定的令牌。

令牌生成似乎工作正常:

 [HttpPost]
        public IHttpActionResult Token()
        {
            var headerAuth = HttpContext.Current.Request.Headers["Authorization"];
            if (headerAuth.ToString().StartsWith("Basic"))
            {
                var credValue = headerAuth.ToString().Substring("Basic".Length).Trim();
                var usernameAndPassEnc = Encoding.UTF8.GetString(Convert.FromBase64String(credValue));
                var usernameAndPass = usernameAndPassEnc.Split(':');

                LdapAuthentication ldap = new LdapAuthentication();

                if (ldap.IsAuthenticated(usernameAndPass[0], usernameAndPass[1]))
                {
                    var claimsData = new[] { new Claim(ClaimTypes.Name, usernameAndPass[0]) };
                    var key = new SymmetricSecurityKey(Encoding.UTF8.GetBytes("secret"));
                    var signInCred = new SigningCredentials(key, SecurityAlgorithms.HmacSha256Signature, SecurityAlgorithms.Sha256Digest);
                    var tokenString = new JwtSecurityToken(
                        issuer: "http://my.website.com",
                        audience: "http://my.tokenissuer.com",
                        expires: DateTime.Now.AddMinutes(1),
                        claims: claimsData,
                        signingCredentials: signInCred
                        );

                    var token = …
Run Code Online (Sandbox Code Playgroud)

c# asp.net jwt

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

如何将数据传递到ng-bootstrap popover

我正在使用ng-bootstrap用Bootstrap编写Angular应用程序。我在这样的组件中封装了一个弹出窗口:

HTML(弹出框组件)

<div>
  <div>Data 1: <i>{{ v.data1 }}</i></div>
  <div>Data 2: <i>{{ v.data2 }}</i></div>
</div>
Run Code Online (Sandbox Code Playgroud)

此弹出窗口在另一个组件中打开:

的HTML

<div *ngFor="let v of vector">
    <span [ngbPopover]="popOver" popoverTitle="Pop title">Open</span>
</div>

<ng-template #popOver>
    <popover></popover>
</ng-template>
Run Code Online (Sandbox Code Playgroud)

我需要将ngFor的v参数传递给弹出框。我该如何实现?

twitter-bootstrap-4 ng-bootstrap angular

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