小编Daw*_*ski的帖子

订阅方法不会对更改做出反应[Angular 2]

我的app.component中有方法可以更改LangService中的语言.当发生更改时,LangService应该使用Observable对象响应所有其他组件,因为我订阅了所有组件中的更改.不幸的是,它没有发生.它只响应调用该函数来改变语言的app.component.我不确定我在哪里弄错了.也许我只是误解了整个概念,因为我是Angular的新手.

这是代码:

app.component.html

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">                                           
        {{ title }}
      </a>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <ol class="breadcrumb">
          <li *ngFor="let lang of langs">
            <a (click)="changeLanguage(lang)">
              {{ lang }}
            </a>  
          </li>
        </ol>
      </ul>
    </div>
  </div>
</nav>
<router-outlet></router-outlet>
Run Code Online (Sandbox Code Playgroud)

app.component.ts

import { Component } from '@angular/core';
import './rxjs-operators';
import { ROUTER_DIRECTIVES } from '@angular/router'; 
import { LangService } from './lang.service';
import { NotesComponent } from './notes/notes.component';

@Component({
  moduleId: module.id,
  selector: 'app-root',
  templateUrl: 'app.component.html', …
Run Code Online (Sandbox Code Playgroud)

angular2-services angular2-observables angular

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

RouterLink在子路由中导航回来

我的申请中的路线很少.父路线admin很少有其他子路线posts, about-me, categories.我希望能够访问子路由并在用户想要的情况下导航回去.我试图添加一个链接

<a class="pointer" [routerLink]="['admin']">Back</a>
Run Code Online (Sandbox Code Playgroud)

但是,路由器只是将此链接添加到ActivatedRoute (所以网址看起来像:http:// localhost/admin/posts/admin).

所以我的问题是从儿童路线导航回来的正确方法是什么?先感谢您.

angular2-routing angular

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

水平菜单,溢出效果淡入淡出

我正在使用CSS3/SASS,如果可能的话,我不想使用任何Javascript.我正在尝试制作一个水平菜单,其中overflow-x会在右侧产生漂亮的淡入淡出效果,因此移动设备上的用户会知道他可以左右移动它.

这是我想要完成的事情:

右侧文字很好淡出

...正如你在图片上看到的那样,右侧的文字正在逐渐消失,当然,这是一个OPTION3菜单项(因此它溢出).

到目前为止,我得到了菜单,但我真的不知道它们的溢出和技巧.

HTML:

<nav class="navbar">
  <ul class="navbar-list">
    <li class="navbar-item"><a href="#">about</a></li>
    <li class="navbar-item"><a href="#">settings</a></li>
    <li class="navbar-item"><a href="#">option1</a></li>
    <li class="navbar-item"><a href="#">option2</a></li>
    <li class="navbar-item"><a href="#">option3</a></li>
  </ul>
</nav>
Run Code Online (Sandbox Code Playgroud)

上海社会科学院:

.navbar
    float: left
    height: 40px
    min-width: 100%
    display: flex
    flex-wrap: wrap

    .navbar-item
        padding: 13px 0px
        font-size: 12px
        line-height: 14px
        text-transform: uppercase
        display: inline-block
        float: left
        margin: 0px 10px

        &.active
            padding: 13px 0px 11px 0px
            border-bottom: 2px solid $light-blue

        &:hover
            cursor: pointer

        a 
            color: $dark-grey
            font-weight: 600
            text-decoration: none
Run Code Online (Sandbox Code Playgroud)

css sass overflow css3

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

将Angular从任何版本更新到最新版本

我曾经在我使用的几个项目上工作过,这些项目angular-cli被配置为在rc4版本中创建应用程序,组件,服务等.现在我想将这些项目更新为角度2(或最新版本)的最终版本,我需要采取哪些步骤才能正确更新它?

是否更好地按版本更新版本,直到我达到所需版本(所以首先将其更新为rc5,检查一切是否正常,然后是rc6,依此类推......)或者可以直接更新到最新版本?

先感谢您.

angular

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

如何通过重写部署的应用程序中的URL使Angular 2路由器工作?

我现在正在完成我的Angular 2应用程序,我想知道如何托管它.

我刚刚尝试在我的localhost上构建应用程序,实际上一切似乎都运行良好,期待Router应用程序.我无法通过重写URL来访问路由,因为它可能正在寻找一些文件和.htaccess RewriteRules,而不是routes.能够通过重写URL来访问路由对我来说很重要,因为我不希望[routerLink]我的管理面板和其他一些东西被公开(被视为超链接).

更具体一点......当我访问http://localhost/FinalApp/它时,使用路由器导航我,http://localhost/FinalApp/list/page/1以便list/page/1由Angular 2路由器添加.所有人[routerLink]都正常工作,并导航我到例如.http://localhost/FinalAll/list/category/3当我点击它们,但当我手动重写URL以进入管理面板(我正在添加admin到我的基础http://localhost/FinalApp/,所以最终的URL看起来像http://localhost/FinalApp/admin)它显示404错误(不是路由器的默认路由,但服务器 - 404).

我希望能够手动重写URL并使用Angular 2 Router.

我错过了什么或者它是不可能的?

angular2-routing angular

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

Docker 与 Symfony 4 - 无法看到文件更改

我正在为 Symfony 4 应用程序的开发环境开发 docker 映像。我正在将其构建在和alpine上。php-fpmnginx

我已经配置了一个应用程序,但即使对于简单的 hello world 应用程序,性能也不是很好(~700ms),所以我想我可以以某种方式让它更快。

首先,我进行了语义配置并将卷配置为使用cached配置。然后,我转移vendor到单独的卷,因为它导致了大部分性能问题。

作为我想使用的第二件事,docker-sync因为基准看起来很棒。我配置了它,一切都运行顺利。但现在我意识到 docker 对代码的更改没有反应。

首先,我认为这与 Symfony 4 缓存有关,所以我确实连接到了php的容器并运行了php bin/console cache:clear。缓存已被清除,但docker没有任何反应。web我仔细检查了容器上的文件php,并且文件已更改。我想知道是否还需要配置更多内容,或者为什么 Symfony 对更改没有反应。


更新

即使在完成镜像重新构建并删除语义配置和docker-sync. 所以,基本上,它是带有 hello-world symfony 4 应用程序的普通 docker,并且不会对更改做出反应。更改甚至不与容器同步


配置:

# docker-compose-dev.yml
version: '3'
volumes:
  symfony-sync:
    external: true
services:
  php:
    build: build/php
    expose:
      - 9000
    volumes:
      - symfony-sync:/var/www/html/symfony
      - ./vendor:/var/www/html/vendor
  web:
    build: build/nginx
    restart: always
    expose:
      - 80 …
Run Code Online (Sandbox Code Playgroud)

symfony docker docker-compose docker-volume symfony4

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

从外部将值传递给Angular应用程序

我正在考虑将基于MVC的网站的前端分成几个组件,并且正在考虑为此目的使用Angular(例如,创建以后可以包含在视图中的购物车应用程序)。

问题是我需要向该应用程序传递几个变量,我想知道如何安全,专业地进行操作。我在想类似的东西:

  1. 我要去 ng build --prod --aot
  2. 我将所有脚本注入了自己的视野
  3. 我注入传递给我的应用程序查看的变量

...和“代码”代表我的想法:

控制器:

public function viewAction()
{
    $this->view->addCss('angular/app/styles.css'); // adds styles for cart app 
    $this->view->addJS('angular/app/scripts.js');  // adds scripts for cart app
    $this->view->setJSVariable('idCustomer', 555); // sets global var idCustomer
}
Run Code Online (Sandbox Code Playgroud)

视图:

<!-- bunch of HTML for view ... -->
<script>
    // CartApp would be an angular app.
    CartApp.use([
        idCustomer
    ]);
</script>
Run Code Online (Sandbox Code Playgroud)

所以我的问题是...是否有可能(并且将是一个很好的解决方案)将CartAppas作为对象,然后执行一些use设置/传递数据的功能(如上述示例)?(比方说一些全球提供的服务/组件或其他任何东西)。还是有其他方法可以做到这一点?就像从window对象中从应用程序内部获取变量一样?(因为它们仍将绑定到窗口)。谢谢。

javascript model-view-controller javascript-objects typescript angular

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