小编Sau*_*kar的帖子

Angular2中的生产和开发模式有什么区别?

出于某种原因,我必须在生产模式下运行我的应用程序.这些模式有什么区别?

development-environment production-environment angular

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

角度通用获取错误:您必须传入NgModule或NgModuleFactory才能进行自举

我按照本指南将现有的angular-cli应用程序转换为角度通用.

你可以在这里查看我的完整源代码.

我能够构建浏览器和客户端项目,但是当我在浏览器中查看应用程序时出现以下错误:

错误:您必须传入NgModule或NgModuleFactory才能在View.engine中进行自举(D:\ng-ssr-demo\dist\server.js:359545:23)

问题出在我的server.ts文件中,其中AppServerModuleNgFactory未定义,并且由于此工厂用于在快速后端引导应用程序,因此引导失败.

./server.ts:

const MockBrowser = require('mock-browser').mocks.MockBrowser;
const mock = new MockBrowser();

// Faster server renders w/ Prod mode (dev mode never needed)
enableProdMode();

// Express server
const app = express();

const PORT = process.env.PORT || 4000;
const DIST_FOLDER = join(process.cwd(), 'dist');

// Fix for window error:
const domino = require('domino');
const fs = require('fs');
const path = require('path');
const template = fs.readFileSync(path.resolve('./', 'dist', 'browser/', 'index.html')).toString();
const win = …
Run Code Online (Sandbox Code Playgroud)

javascript angular-cli angular-universal angular angular5

21
推荐指数
2
解决办法
1964
查看次数

Jquery单击事件未在使用jquery动态创建的元素上触发

我正在尝试创建一个简单的功能,用户从下拉列表中选择一些值,然后单击添加按钮以标记的形式在下面的div中添加所选项目.

每个添加的标记都有一个删除锚点,单击它时会删除标记.

现在,当点击添加按钮时,正确插入了标签,但是当我点击标签上的删除按钮时,点击事件未触发.

但是,如果我使用与动态生成的标记完全相同的标记对某些标记进行硬编码,则删除标记的click事件会正确触发,并且标记将按照我的意愿删除.

HTML:

    <select id="ddlTagName">
    <option value="1">Tag One</option>
    <option value="2">Tag Two</option>
    <option value="3">Tag Three</option>
</select>
<input id="btnInsertTag" type="button" value="Add"/>
<br/>

<div id="TagsHolder">
  <span class="tag">
      <span>Tag One HardCoded </span>
      <a class="remove">X</a>
  </span>

  <span class="tag">
      <span>Tag Two HardCoded </span>
      <a class="remove">X</a>
  </span>
</div>
Run Code Online (Sandbox Code Playgroud)

JS:

    $("#btnInsertTag").click(function () {
    var selectedTagText = $("#ddlTagName option:selected").text();
    var selectedTagValue = $('#ddlTagName').val();
    var generateMarkup = '<span class="tag" data-value="' + selectedTagValue + '"><span>' + selectedTagText + ' </span><a class="remove">X</a></span>';
    $("#TagsHolder").append(generateMarkup);
});

$(".remove").click(function () {
    alert('click event triggered'); …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery

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

$ scope.$ $在$ rootScope之后没有触发.$在角度服务中广播

这可能是重复的问题,但我发现这个问题的解决方法在我的情况下不起作用,这就是我发布问题的原因.

我有以下服务:

appRoot.service('MyService', function($rootScope) {
    var Messenger = {
        Temp: "",
        TempId:"",
        tempMethod: function(Id) {
            TempId = Id;
            $rootScope.$broadcast('FirstCtrlMethod');
        }
    };
    return Messenger ;
});
Run Code Online (Sandbox Code Playgroud)

第二个控制器:

appRoot.controller('SecondCtrl', function ($scope, $location, MyResource, NotificationService, MyService) {
 $scope.invokeFirstCtrl= function() {
        var Id = '2';
        MyService.tempMethod(Id);
});
Run Code Online (Sandbox Code Playgroud)

第一个控制器:

appRoot.controller('FirstCtrl', function ($scope, $compile, $filter, $modal, $sce, $location, NotificationService, MyService) {
$scope.$on('FirstCtrlMethod', function () {        
        alert('I am from frist controller');
    });
});
Run Code Online (Sandbox Code Playgroud)

问题:"$ rootScope.$ broadcast('FirstCtrlMethod');" 正在按预期执行,但它不会导致在第一个控制器中触发事件"$ scope.$ on('FirstCtrlMethod',function(){..".我在我的应用程序的许多地方使用了差异服务同样的方式,他们工作得很好,我不明白为什么它不在这里工作.

javascript angularjs

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

如果源json已更新(添加或删除项目),则动态更新D3 Sunburst

我是D3的新手,如果修改了源json,我会尝试动态更新图表.但我无法做到这一点.

请检查这个plunkr

JS:

var width = 500,
    height = 500,
    radius = Math.min(width, height) / 2;

var x = d3.scale.linear()
    .range([0, 2 * Math.PI]);

var y = d3.scale.sqrt()
    .range([0, radius]);

var color = d3.scale.category10();

var svg = d3.select("body").append("svg")
    .attr("width", width)
    .attr("height", height)
    .append("g")
    .attr("transform", "translate(" + width / 2 + "," + (height / 2 + 10) + ") rotate(-90 0 0)");

var partition = d3.layout.partition()
    .value(function(d) {
        return d.size;
    });

var arc = d3.svg.arc()
    .startAngle(function(d) {
        return Math.max(0, …
Run Code Online (Sandbox Code Playgroud)

javascript jquery json d3.js sunburst-diagram

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

如何部署具有多个区域的asp.net mvc 4应用程序

我按照这篇文章制作了可插拔的asp.net mvc4应用程序

但在部署应用程序时面临问题.在我的解决方案中,MainProj是主项目,其中所有其他项目都在区域文件夹中.每个项目都有它的模型,视图和控制器.我已经在MainProj中提供了所有子项目(区域文件夹中的项目)的引用.现在,当尝试部署MainProj时,它只发布带有视图的主项目(在本例中为MainProj),区域文件夹中的项目没有部署(例如:Cart,CRM).即使我在主项目(MainProj)中添加区域(ex CRM)项目的引用,也只有区域项目的ddl(ex CRM)部署在bin文件夹中,区域中没有项目视图(CRM)部署.什么是错的.

这是解决方案的结构:

在此输入图像描述

这是我原来的文件夹结构.

在此输入图像描述

但是当我在visual studio中以调试模式运行我的项目时,应用程序运行得非常好.所以我点击屏幕底部系统托盘中的iis express图标,观察到visual studio为每个项目托管不同的站点.

在此输入图像描述

这里找到一些类似的答案,但在我的案例中却没有.请让我知道我错过了什么或做错了什么.部署此类应用程序的正确方法是什么.提前致谢.

c# asp.net asp.net-mvc web-deployment asp.net-mvc-4

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

在webworker中运行Angular 5 app会导致窗口对象未定义

我正在尝试将此(ngx-admin)免费的Angular模板升级到Angular 5,然后尝试在此SO Post中提到的WebWorker中运行整个应用程序.

我成功将应用程序升级到Angular 5并且工作正常但是当我尝试将应用程序配置为在Webworker中运行时,它会出现以下错误:

在此输入图像描述

在此输入图像描述

完整的代码(修改为Angular 5和webworker)可以在这里找到

我试图在我的webpack配置中添加DefinePlugin,但没有运气.

webpack.config.json:

new DefinePlugin({
  window: undefined,
  document: undefined
}),
Run Code Online (Sandbox Code Playgroud)

我能够在webworker中运行新的空angular-cli应用程序,但我无法在webworker中运行此模板.我想有一些节点包正在创建问题.

的package.json:

{
  "scripts": {
    "ng": "ng",
    "conventional-changelog": "conventional-changelog",
    "e2e": "protractor ./protractor.conf.js",
    "docs": "compodoc -p src/tsconfig.app.json -d docs",
    "docs:serve": "compodoc -p src/tsconfig.app.json -d docs -s",
    "release:changelog": "npm run conventional-changelog -- -p angular -i CHANGELOG.md -s",
    "build": "webpack",
    "start": "webpack-dev-server --port=4200",
    "test": "karma start ./karma.conf.js",
    "pree2e": "webdriver-manager update --standalone false --gecko false --quiet"
  },
  "dependencies": {
    "@agm/core": "1.0.0-beta.2",
    "@angular/animations": …
Run Code Online (Sandbox Code Playgroud)

javascript webpack angular-cli angular angular5

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

在D3地图上显示工具提示

我使用D3和国家geojson创建了一个基本地图.这是演示.

现在,当用户点击地图上的任何坐标时,我会在工具提示中显示天气信息,并以天气图标作为标记.

countries = countriesGroup
    .selectAll("path")
    .data(json.features)
    .enter()
    .append("path")
    .attr("d", path)
    .attr("id", function(d, i) {
        return "country" + d.properties.iso_a3;
    })
    .attr("class", "country")
    // add a mouseover action to show name label for feature/country
    .on("mouseover", function(d, i) {
        d3.select("#countryLabel" + d.properties.iso_a3).style("display", "block");
    })
    .on("mouseout", function(d, i) {
        d3.select("#countryLabel" + d.properties.iso_a3).style("display", "none");
    })
    // add an onclick action to zoom into clicked country
    .on("click", function(d, i) {
        var eventLocation = d3.mouse(this);
        var coordinates = projection.invert(eventLocation);
        var proxy = …
Run Code Online (Sandbox Code Playgroud)

javascript gis tooltip d3.js

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

无法在Firefox中调试Typescript(源)文件

好吧,我使用5 Min QUICKSTART创建了一个基本的Angular 2 Typescript项目,它已启动并运行.

我的typescript transpiller配置为创建源映射:

tsconfig.js

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  }
}
Run Code Online (Sandbox Code Playgroud)

现在我可以在Chrome中看到*.ts文件,并且可以调试它们,没有任何问题.但Firefox(以及FireFox Developer Edition)根本没有显示.ts文件,即使在调试器选项中选中了"显示原始源".

在此输入图像描述

javascript firefox typescript firefox-developer-tools firefox-developer-edition

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

使用 javascript 在客户端动态创建面包屑

我想使用 java 脚本在客户端动态创建面包屑。面包屑将是用户导航时遵循的路径: 主页 > 关于我们 > 我们的历史..

锚标记将按照用户导航的顺序在每个页面上生成。

现在我可以使用服务器端技术轻松创建这些面包屑,但我想在客户端的每个页面上动态生成它。现在我不知道具体如何实现。

我心中的一些逻辑是:

  1. 在 Java 脚本中使用名称对创建一个对象类型变量,其中名称当前页面的名称,该页面的 url

  2. 现在,在从一个页面导航到另一页面时,使用查询字符串传递此对象变量。

  3. 然后在第二页中从查询字符串中获取该对象变量,并从该对象中提取名称和值对,然后使用它创建锚点并将其添加到目标 div(占位符)。

  4. 再次,当用户转到另一个页面时,在对象变量的最后添加 所有先前页面的名称和值对以及当前页面的名称和值对,并使用查询字符串将其传递到下一页。

  5. 现在在下一页中执行相同操作并创建锚点。

我使用 html5 客户端存储得到的一些类似内容为 html :

<ul id="navigation_links">
    <li>Page1</li>
    <li>Page2</li>
    <li>Page3</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

js:

$(document).ready(function(){
    bindEventToNavigation();
});

function bindEventToNavigation(){
    $.each($("#navigation_links > li"), function(index, element){
        $(element).click(function(event){
            breadcrumbStateSaver($(event.currentTarget).html());
            showBreadCrumb();
        });
    });
} …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery breadcrumbs query-string

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