text:
i cant install by pip install

im trying to install your lib by PIP but im getting some errors
i  instaled all requirements and i have opencv in system path,

Microsoft Windows [versão 10.0.18363.959]
(c) 2019 Microsoft Corporation. Todos os direitos reservados.

C:\Users\MasterRoot>pip install pybgs
Collecting pybgs
  Downloading pybgs-3.0.0.post2.tar.gz (850 kB)
     |████████████████████████████████| 850 kB 3.3 MB/s
Building wheels for collected packages: pybgs
  Building wheel for pybgs (setup.py) ... error
  ERROR: Command errored out with exit status 1:
   command: 'c:\python38-32\python.exe' -u -c 'import sys, setuptools, tokenize; sys.argv[0] = '"'"'C:\\Users\\MasterRoot\\AppData\\Local\\Temp\\pip-install-6b5xsb2g\\pybgs\\setup.py'"'"'; __file__='"'"'C:\\Users\\MasterRoot\\AppData\\Local\\Temp\\pip-install-6b5xsb2g\\pybgs\\setup.py'"'"';f=getattr(tokenize, '"'"'open'"'"', open)(__file__);code=f.read().replace('"'"'\r\n'"'"', '"'"'\n'"'"');f.close();exec(compile(code, __file__, '"'"'exec'"'"'))' bdist_wheel -d 'C:\Users\MasterRoot\AppData\Local\Temp\pip-wheel-mxwnwkf9'
       cwd: C:\Users\MasterRoot\AppData\Local\Temp\pip-install-6b5xsb2g\pybgs\
  Complete output (47 lines):
  running bdist_wheel
  running build
  running build_ext
  Preparing the build environment
  Configuring cmake project
  C:\Python38-32\Scripts\cmake.exe -HC:\Users\MasterRoot\AppData\Local\Temp\pip-install-6b5xsb2g\pybgs -Bbuild\temp.win32-3.8\Release -DPYTHON_EXECUTABLE=c:\python38-32\python.exe -DBGS_CORE_STATIC=ON -DBGS_PYTHON_SUPPORT=ON -DBGS_PYTHON_ONLY=ON -DBGS_PYTHON_VERSION=3.8
  -- Building for: Visual Studio 15 2017
  -- Selecting Windows SDK version 10.0.17763.0 to target Windows 10.0.18363.
  -- The C compiler identification is MSVC 19.16.27035.0
  -- The CXX compiler identification is MSVC 19.16.27035.0
  -- Check for working C compiler: C:/Program Files (x86)/Microsoft Visual Studio/2017/Community/VC/Tools/MSVC/14.16.27023/bin/Hostx86/x86/cl.exe
  -- Check for working C compiler: C:/Program Files (x86)/Microsoft Visual Studio/2017/Community/VC/Tools/MSVC/14.16.27023/bin/Hostx86/x86/cl.exe -- works
  -- Detecting C compiler ABI info
  -- Detecting C compiler ABI info - done
  -- Detecting C compile features
  -- Detecting C compile features - done
  -- Check for working CXX compiler: C:/Program Files (x86)/Microsoft Visual Studio/2017/Community/VC/Tools/MSVC/14.16.27023/bin/Hostx86/x86/cl.exe
  -- Check for working CXX compiler: C:/Program Files (x86)/Microsoft Visual Studio/2017/Community/VC/Tools/MSVC/14.16.27023/bin/Hostx86/x86/cl.exe -- works
  -- Detecting CXX compiler ABI info
  -- Detecting CXX compiler ABI info - done
  -- Detecting CXX compile features
  -- Detecting CXX compile features - done
  --
  -- BGS_PYTHON_SUPPORT: ON
  -- BGS_PYTHON_ONLY:    ON
  -- BGS_CORE_STATIC:    ON
  -- PYTHON VERSION: 3.8
  CMake Error at CMakeLists.txt:113 (find_package):
    By not providing "FindOpenCV.cmake" in CMAKE_MODULE_PATH this project has
    asked CMake to find a package configuration file provided by "OpenCV", but
    CMake did not find one.

    Could not find a package configuration file provided by "OpenCV" with any
    of the following names:

      OpenCVConfig.cmake
      opencv-config.cmake

    Add the installation prefix of "OpenCV" to CMAKE_PREFIX_PATH or set
    "OpenCV_DIR" to a directory containing one of the above files.  If "OpenCV"
    provides a separate development package or SDK, be sure it has been
    installed.

  -- Configuring incomplete, errors occurred!
  See also "C:/Users/MasterRoot/AppData/Local/Temp/pip-install-6b5xsb2g/pybgs/build/temp.win32-3.8/Release/CMakeFiles/CMakeOutput.log".
  error: command 'C:\\Python38-32\\Scripts\\cmake.exe' failed with exit status 1
  ----------------------------------------
  ERROR: Failed building wheel for pybgs
  Running setup.py clean for pybgs
Failed to build pybgs
Installing collected packages: pybgs
    Running setup.py install for pybgs ... error
    ERROR: Command errored out with exit status 1:
     command: 'c:\python38-32\python.exe' -u -c 'import sys, setuptools, tokenize; sys.argv[0] = '"'"'C:\\Users\\MasterRoot\\AppData\\Local\\Temp\\pip-install-6b5xsb2g\\pybgs\\setup.py'"'"'; __file__='"'"'C:\\Users\\MasterRoot\\AppData\\Local\\Temp\\pip-install-6b5xsb2g\\pybgs\\setup.py'"'"';f=getattr(tokenize, '"'"'open'"'"', open)(__file__);code=f.read().replace('"'"'\r\n'"'"', '"'"'\n'"'"');f.close();exec(compile(code, __file__, '"'"'exec'"'"'))' install --record 'C:\Users\MasterRoot\AppData\Local\Temp\pip-record-erp0f12n\install-record.txt' --single-version-externally-managed --compile --install-headers 'c:\python38-32\Include\pybgs'
         cwd: C:\Users\MasterRoot\AppData\Local\Temp\pip-install-6b5xsb2g\pybgs\
    Complete output (47 lines):
    running install
    running build
    running build_ext
    Preparing the build environment
    Configuring cmake project
    C:\Python38-32\Scripts\cmake.exe -HC:\Users\MasterRoot\AppData\Local\Temp\pip-install-6b5xsb2g\pybgs -Bbuild\temp.win32-3.8\Release -DPYTHON_EXECUTABLE=c:\python38-32\python.exe -DBGS_CORE_STATIC=ON -DBGS_PYTHON_SUPPORT=ON -DBGS_PYTHON_ONLY=ON -DBGS_PYTHON_VERSION=3.8
    -- Building for: Visual Studio 15 2017
    -- Selecting Windows SDK version 10.0.17763.0 to target Windows 10.0.18363.
    -- The C compiler identification is MSVC 19.16.27035.0
    -- The CXX compiler identification is MSVC 19.16.27035.0
    -- Check for working C compiler: C:/Program Files (x86)/Microsoft Visual Studio/2017/Community/VC/Tools/MSVC/14.16.27023/bin/Hostx86/x86/cl.exe
    -- Check for working C compiler: C:/Program Files (x86)/Microsoft Visual Studio/2017/Community/VC/Tools/MSVC/14.16.27023/bin/Hostx86/x86/cl.exe -- works
    -- Detecting C compiler ABI info
    -- Detecting C compiler ABI info - done
    -- Detecting C compile features
    -- Detecting C compile features - done
    -- Check for working CXX compiler: C:/Program Files (x86)/Microsoft Visual Studio/2017/Community/VC/Tools/MSVC/14.16.27023/bin/Hostx86/x86/cl.exe
    -- Check for working CXX compiler: C:/Program Files (x86)/Microsoft Visual Studio/2017/Community/VC/Tools/MSVC/14.16.27023/bin/Hostx86/x86/cl.exe -- works
    -- Detecting CXX compiler ABI info
    -- Detecting CXX compiler ABI info - done
    -- Detecting CXX compile features
    -- Detecting CXX compile features - done
    --
    -- BGS_PYTHON_SUPPORT: ON
    -- BGS_PYTHON_ONLY:    ON
    -- BGS_CORE_STATIC:    ON
    -- PYTHON VERSION: 3.8
    CMake Error at CMakeLists.txt:113 (find_package):
      By not providing "FindOpenCV.cmake" in CMAKE_MODULE_PATH this project has
      asked CMake to find a package configuration file provided by "OpenCV", but
      CMake did not find one.

      Could not find a package configuration file provided by "OpenCV" with any
      of the following names:

        OpenCVConfig.cmake
        opencv-config.cmake

      Add the installation prefix of "OpenCV" to CMAKE_PREFIX_PATH or set
      "OpenCV_DIR" to a directory containing one of the above files.  If "OpenCV"
      provides a separate development package or SDK, be sure it has been
      installed.

    -- Configuring incomplete, errors occurred!
    See also "C:/Users/MasterRoot/AppData/Local/Temp/pip-install-6b5xsb2g/pybgs/build/temp.win32-3.8/Release/CMakeFiles/CMakeOutput.log".
    error: command 'C:\\Python38-32\\Scripts\\cmake.exe' failed with exit status 1
    ----------------------------------------
ERROR: Command errored out with exit status 1: 'c:\python38-32\python.exe' -u -c 'import sys, setuptools, tokenize; sys.argv[0] = '"'"'C:\\Users\\MasterRoot\\AppData\\Local\\Temp\\pip-install-6b5xsb2g\\pybgs\\setup.py'"'"'; __file__='"'"'C:\\Users\\MasterRoot\\AppData\\Local\\Temp\\pip-install-6b5xsb2g\\pybgs\\setup.py'"'"';f=getattr(tokenize, '"'"'open'"'"', open)(__file__);code=f.read().replace('"'"'\r\n'"'"', '"'"'\n'"'"');f.close();exec(compile(code, __file__, '"'"'exec'"'"'))' install --record 'C:\Users\MasterRoot\AppData\Local\Temp\pip-record-erp0f12n\install-record.txt' --single-version-externally-managed --compile --install-headers 'c:\python38-32\Include\pybgs' Check the logs for full command output.

C:\Users\MasterRoot>

我也遇到过，刚刚解决，方案：
1.这里的opencv是C++的opencv,不是python的，所以需要下载一个c++的 (我下载的是3.4.2版本), 还要配置opencv的环境变量哟
opencv下载地址：https://opencv.org/releases.html#
2.在系统环境中，新增一个环境变量：OpenCV_DIR，地址为opencv的lib (如，我的是：C:\opencv\build\x64\vc15\lib)
配置讲解：https://blog.csdn.net/maizousidemao/article/details/81474834
（注：如果不是用vs开发，可以忽略 “三、部署opencv”）
3.我是在windows下安装的，这个时候输入“pip install pybgs” 还会有个“-j8”的错误，解决方法：
下载源码，删除setup.py文件中的169行中的”-j8“项，之后安装成功，并能正常使用；
如果是linux下，这一步可能不会有问题。

thank you

wqc007你好，谢谢你的帮助，按照你提供的步骤做了，但是后面还是报错。
- Found PythonInterp: E:/ProgramFiles/Anaconda3/python.exe (found suitable version "3.7.4", minimum required is "3.7")  CMake Error at modules/pybind11/tools/FindPythonLibsNew.cmake:127 (message):   Python config failure: Python is 64-bit, chosen compiler is 32-bit Call Stack (most recent call first):   modules/pybind11/tools/pybind11Tools.cmake:16 (find_package)   modules/pybind11/CMakeLists.txt:33 (include)
删除setup.py文件中第169行的”-j8“项后，这个问题也没有解决，请问你遇到过这个问题吗？请教下您如何解决？
@wqc007

我也遇到过，刚刚解决，方案：
1.这里的opencv是C ++的opencv，不是python的，所以需要下载一个c ++的（我下载的是3.4.2版本），还要配置opencv的环境变量
opencv下载地址：https : //opencv.org/releases.html#
2.在系统环境中，添加一个环境变量：OpenCV_DIR，地址为opencv的lib（如，我的是：C：\ opencv \ build \ x64 \ vc15 \ lib）
配置讲解：https：//blog.csdn .net / maizousidemao / article / details / 81474834
（注：如果不是用vs开发，可以忽略“三，部署opencv”）
3.我是在windows下安装的，这个时候输入“ pip install pybgs”将会有个“ -j8”的错误，解决方法：
下载源码，通过源码安装，删除setup.py文件中的169行中的” -j8”项，之后安装成功，并能正常使用；
如果是linux下，这一步可能不会有问题。

您好，我也有这种错误，但是您的方案我试过了，还是有错。python 3.6 ,opencv3.4.2，请问您是否知道还有什么原因会导致此结果？

我也遇到过，刚刚解决，方案：
1.这里的opencv是C ++的opencv，不是python的，所以需要下载一个c ++的（我下载的是3.4.2版本），还要配置opencv的环境变量
opencv下载地址：https : //opencv.org/releases.html#
2.在系统环境中，添加一个环境变量：OpenCV_DIR，地址为opencv的lib（如，我的是：C：\ opencv \ build \ x64 \ vc15 \ lib）
配置讲解：https：//blog.csdn .net / maizousidemao / article / details / 81474834
（注：如果不是用vs开发，可以忽略“三，部署opencv”）
3.我是在windows下安装的，这个时候输入“ pip install pybgs”将会有个“ -j8”的错误，解决方法：
下载源码，通过源码安装，删除setup.py文件中的169行中的” -j8”项，之后安装成功，并能正常使用；
如果是linux下，这一步可能不会有问题。

您好，我也有这种错误，但是您的方案我试过了，还是有错。python 3.6 ,opencv3.4.2，请问您是否知道还有什么原因会导致此结果？

@momo-github-1984
你好，我的问题解决了，不晓得您是不是类似的问题。我pip不成功，就自己下载的源码，并下载CMake，自己编译，在cmakelists.txt的本级目录新建文件夹build，之后在build文件夹中打开cmd，输入cmake -D OpenCV_DIR=%OpenCV_DIR% -D BGS_PYTHON_SUPPORT=ON -G "Visual Studio 14 Win64" ..
就成功了。希望能帮到你。

@momo-github-1984
你好，我的问题解决了，不晓得您是不是类似的问题。我pip不成功，就自己下载的源码，并下载CMake，自己编译，在cmakelists.txt的本级目录新建文件夹build，之后在build文件夹中打开cmd，输入cmake -D OpenCV_DIR=%OpenCV_DIR% -D BGS_PYTHON_SUPPORT=ON -G "Visual Studio 14 Win64" ..
就成功了。希望能帮到你。

您好，感谢您的热心帮助！实际上我在不添加BGS_PYTHON_SUPPORT=ON 这个参数的时候，是可以像您这样编译的，但是加上去就不行。我想在python中实现编译，但是失败了！
------------------ 原始邮件 ------------------
发件人:                                                                                "andrewssobral/bgslibrary"                                                                                <notifications@github.com>;
发送时间: 2021年1月26日(星期二) 下午3:08
收件人: "andrewssobral/bgslibrary"<bgslibrary@noreply.github.com>;
抄送: "一打冷光"<731778695@qq.com>;"Mention"<mention@noreply.github.com>;
主题: Re: [andrewssobral/bgslibrary] i cant install by pip install (#184)
@momo-github-1984
你好，我的问题解决了，不晓得您是不是类似的问题。我pip不成功，就自己下载的源码，并下载CMake，自己编译，在cmakelists.txt的本级目录新建文件夹build，之后在build文件夹中打开cmd，输入cmake -D OpenCV_DIR=%OpenCV_DIR% -D BGS_PYTHON_SUPPORT=ON -G "Visual Studio 14 Win64" ..
就成功了。希望能帮到你。
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub, or unsubscribe.

您好，感谢您的热心帮助！实际上我在不添加BGS_PYTHON_SUPPORT=ON 这个参数的时候，是可以像您这样编译的，但是加上去就不行。我想在python中实现编译，但是失败了！
------------------ 原始邮件 ------------------
发件人:                                                                                "andrewssobral/bgslibrary"                                                                                <notifications@github.com>;
发送时间: 2021年1月26日(星期二) 下午3:08
收件人: "andrewssobral/bgslibrary"<bgslibrary@noreply.github.com>;
抄送: "一打冷光"<731778695@qq.com>;"Mention"<mention@noreply.github.com>;
主题: Re: [andrewssobral/bgslibrary] i cant install by pip install (#184)
@momo-github-1984
你好，我的问题解决了，不晓得您是不是类似的问题。我pip不成功，就自己下载的源码，并下载CMake，自己编译，在cmakelists.txt的本级目录新建文件夹build，之后在build文件夹中打开cmd，输入cmake -D OpenCV_DIR=%OpenCV_DIR% -D BGS_PYTHON_SUPPORT=ON -G "Visual Studio 14 Win64" ..
就成功了。希望能帮到你。
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub, or unsubscribe.

Hello @wanglu-nj @momo-github-1984 @TheMasterRoot @wqc007
Should I consider this problem solved?
For info, I just released a new version of the BGSLibrary, now v3.1.0.
I tested it on Windows, Mac and Linux, both compiling the C++ library on OpenCV 3.4.7, 3.4.16 and 4.6.0.
I also tested its respective Python wrapper and GT user interface.
Python package: https://pypi.org/project/pybgs/3.1.0.post0/
Docker files: https://github.com/andrewssobral/docker/tree/master/bgslibrary
Updated installation steps on Windows:
https://github.com/andrewssobral/bgslibrary/wiki/Installation-instructions---Windows#how-to-compile-on-windows-10--msvs2019--opencv-347
Everything is working for me, could you please check in your side if this new version fix your issues?
Thanks in advance,
Andrews

repo: andrewssobral/bgslibrary


text:
The flag placement is not accurate at all

When running the script, it will place flags and sometimes the flags are not on bomb locations.
This causes problems where it thinks it is solved but it isn't.

Didn’t noticr such behaviour what is your display resolution?

1920x1080, but I have 3 monitors connected. When running the script, it was putting flags on positions that are not really bombs, so I had to go in manually and fix the locations so I can complete the level.

Are you sure that you have no color filters enabled, such as HDR or Nvidia/AMD color enhancements? It sounds like cell recognition fails. You can also have a look at the output in the terminal, what is the most common debug message there?

I have an AMD GPU, and I have not turned on any HDR. Attached is the "debug_board_detection.png".
As you can see it found everything, but on the last row, there are three mine flags which is incorrect. The center flag should not be there.

Here's another example:

This error can be happening only if cell images are close, but not exactly the same, so miss detection  happens. The only reasons I know of are: dota resultion / monitor resolution are not set to 1920 x 1080, or you are using something in AMD that changes the picture on your monitor. It worked for most of the people without miss detection of a single tile, if that happens so often to you, there must be something different in your setup.

The only thing I have enabled is the anti-lag, but that shouldn't affect anything like this.
I'll keep playing with it.

source: gharchive/issue

license: MIT

license_type: permissive

license_source: github-api


text:
Ignore dummy preparation exception to avoid crash

fix #285

I don't think this PR solves the underlying problem. If preparation fails, then the surface will not be appropriately allocated (at least in some devices)

Hi @ecoopnet are you still interested in merging this PR?

Hi @owahltinez
Yes, you're right, I think it's an unnatural amendment, too.
However, we had to do this because we had a problem with pixel 3a, a widely used android device, which always crashes when applying this sample project in our project.
We have no problem with this fix on our device, but I'm wondering if some devices need preparation.
If only there was a better way...

Still crash when really to record.

@peerless2012 may you add your device mode to https://github.com/android/camera-samples/issues/285?
looks like that issue needs to be revisited, intending to close this PR.  thanks

source: gharchive/pull-request

authors: ecoopnet ggfan owahltinez peerless2012

repo: android/camera-samples

license_source: bigquery


text:
Icons alignment to use NiaIcons

Changes

Changed icons used to use Nia Design System defined icons.
Replaced ArrowBack from Rounded to Filled variant as Rounded was not used, but Filled was.

Hi,
The android tests are passing locally, but failing in CI.
Can anyone please help me understand how to fix it?

Please could you fix the merge conflicts.

@dturner Done.

Thank you for your contribution!

authors: Abhimanyu14 dturner mmoczkowski

repo: android/nowinandroid


text:
Update SDK and JDK versions. Fix compatibility.

 Issue by kirillsmirnov1
Sunday Jul 28, 2019 at 06:47 GMT
Originally opened as https://github.com/android/android-RecyclerView/pull/28

Updated minSDK.
Set dependecies versions to be the same.
Fixed activity call to work with current API.
More details here.

kirillsmirnov1 included the following code: https://github.com/android/android-RecyclerView/pull/28/commits

 Comment by googlebot
Sunday Jul 28, 2019 at 06:47 GMT

Thanks for your pull request. It looks like this may be your first contribution to a Google open source project (if not, look below for help). Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).
:memo: Please visit https://cla.developers.google.com/ to sign.
Once you've signed (or fixed any issues), please reply here (e.g. I signed it!) and we'll verify it.

What to do if you already signed the CLA
Individual signers

It's possible we don't have your GitHub username or you're using a different email address on your commit. Check your existing CLA data and verify that your email is set on your git commits.

Corporate signers

Your company has a Point of Contact who decides which employees are authorized to participate. Ask your POC to be added to the group of authorized contributors. If you don't know who your Point of Contact is, direct the Google project maintainer to go/cla#troubleshoot (Public version).
The email used to register you as an authorized contributor must be the email used for the Git commit. Check your existing CLA data and verify that your email is set on your git commits.
The email used to register you as an authorized contributor must also be attached to your GitHub account.

ℹ Googlers: Go here for more info.

 Comment by kirillsmirnov1
Sunday Jul 28, 2019 at 06:48 GMT

I signed it!

 Comment by googlebot
Sunday Jul 28, 2019 at 06:49 GMT

CLAs look good, thanks!
ℹ Googlers: Go here for more info.

repo: android/views-widgets


text:
Comprehensive guide/documentation for swing constraintlayout

Hello esteemed developers!
I have been using the constraintlayout for swing package in a major ui project and I have also contributed a bug fix which was merged... See #767.
My project is in an advanced stage and I was wondering if a comprehensive documentation (even if its a README, maybe), could be added to the repository. Or perhaps, if one exists, maybe someone could point me in its direction.
I usually have to scour through the source to understand what is going on.
Thanks a lot!

We do not have enough people to work on on releasing the Swing library.  That why it just exist here.
We deliver ConstraintLayout/MotionLayout for Android & Compose. The core libraries are pure Java and are the foundation for all other libraries. They are used in with swing library
The swing library was built it for some internal projects and as a proof of concept.
We have no documentation for the Swing version but I would be happy to answer any questions you have here.
For the high level concepts of ConstraintLayout XML there are many many on line sources.

Thanks for responding. Please could you share your experience with the constraintlayout-swing library in the internal projects you mentioned? Like memory usage and speed in comparison to other layouts like MigLayout , GridLayout and GridBagLayout.
Also are there any gotchas that I would need to know about.
I am so sorry I have to ask all of these. I really dont have enough time to run all these checks and tests as I am very close to production and my project is very far gone. Any information you give me would be greatly treasured.
Its been very convenient using the library so far and I am grateful that this library made my work so much easier, since I am an experienced Android developer.

repo: androidx/constraintlayout


text:
Referring to ConsoleLog from Web Page Test Results

There is a ConsoleLog element in the response. But it has multiple sub elements. e.g.
<consoleLog>
<entry>
<source>console-api</source>
<level>warning</level>
<message>
JQMIGRATE: jQuery.fn.andSelf() replaced by jQuery.fn.addBack()
</message>
<url>
https://d10d8p3bp9wpno.cloudfront.net/media/js/fafd3e053bab5cabb970f7edd7f54700.js
</url>
<line>12522</line>
</entry>
<entry>
<source>console-api</source>
<level>warning</level>
<message>JQMIGRATE: jQuery.browser is deprecated</message>
<url>
https://d10d8p3bp9wpno.cloudfront.net/media/js/fafd3e053bab5cabb970f7edd7f54700.js
</url>
<line>12522</line>
</entry>
</consoleLog>

How do you refer to the message element?
I have tried data.median.firstView.consoleLog.entry.message but it says undefined.
Taken fro https://www.webpagetest.org/result/161117_X3_2A6F/?f=xml

Actually, this works:
data.median.firstView.consoleLog

repo: andydavies/WPT-Bulk-Tester

license: mit


text:
Update index.html

Fixed missing quotes on stylesheet link

sweet


text:
Error: The style-loader cannot be used in a non-browser environment

I have installed coverflow and I have MERN stack in use. I get following error whenever I want to start my project by using npm start:
Error: The style-loader cannot be used in a non-browser environment
What's the reason for that issue and how I can solve it? I have been searching on internet but still didn't found any working solution. #

Any update on this. Having the same issue.

Sorry for that I focus on working and change to vue.js currently so have no time to update.
But I will attempt to fix problem

@amilajack & @battuashwik - try pulling the newest branch and LMK if it works. I've just updated the packages and removed some of the deprecated packages.

repo: andyyou/react-coverflow


text:
loadRemoteModule with a remote of a remote

I'm trying to set up a set of repos where I'm loading routes in a chain:
The shell loads routes from the request repo and that one in turn should load routes from the request-parties repo.
The issue I'm having is that the remote of the middle repo is empty.
I tried adding the third remote to the host, add it to both, add it explicitly in the shared object, none of it worked.
The error I'm getting is:
async function loadRemoteModule(optionsOrRemoteName, exposedModule) {
    const options = normalizeOptions(optionsOrRemoteName, exposedModule);
    await ensureRemoteInitialized(options);
    const remoteName = getRemoteNameByOptions(options);
    const remote = getRemote(remoteName);
    if (!remote) {
        throw new Error('unknown remote ' + remoteName);
    }

Is there a way to do this? (I'm currently working through your code to see whether I can inject it somewhere for the moment)
The shell repo (host) has this manifest:
{ "request": "http://localhost:4210/remoteEntry.json" }

and these routes:
export const routes: Routes = [
  { path: '', pathMatch: 'full', redirectTo: 'request-routes' },
  { path: 'request-component', loadComponent: () => loadRemoteModule('request', './RequestComponent').then((m) => m.AppComponent) },
  { path: 'request-routes', loadChildren: () => loadRemoteModule('request', './request-routes').then((m) => m.requestRoutes) }
];

The request repo (remote) has this manifest:
{ "@cob/request-parties": "http://localhost:4220/remoteEntry.json" }

and these routes
export const requestRoutes: Routes = [
  {path: '', pathMatch: 'full', redirectTo: 'request-parties-component'},
  {path: 'request', component: RequestComponent},
  {path: 'parties', component: RequestComponent, loadChildren: () => loadRemoteModule('@cob/request-parties', './request-parties-routes').then((m) => m.requestPartyRoutes)},
  {path: 'party', loadComponent: () => loadRemoteModule('@cob/request-parties', './Component').then((m) => m.AppComponent)},
  {path: 'request-parties-component', loadComponent: () => loadRemoteModule('@cob/request-parties', './Component').then((m) => m.AppComponent)  },
];

and this federation config:
module.exports = withNativeFederation({
  name: 'request',
  exposes: {
    './RequestComponent': './projects/request/src/app/request.component.ts',
    './request-routes': './projects/request/src/app/request.routes.ts'
  },
  ...
}

and the request parties repo (another remote) has these routes:
export const requestPartyRoutes: Routes = [
  {path: '', pathMatch: 'full', redirectTo: 'party'},
  {path: 'party', component: AppComponent}
];

and this federation config:
module.exports = withNativeFederation({
  name: '@cob/request-parties',
  exposes: {
    './Component': './modules/request-parties/src/app/app.component.ts',
    './request-parties-routes': './modules/request-parties/src/app/app.routes.ts',
  },
   ...
}

Hi,
thanks for this message.
Can you please try to reference all the remote (also the indirect ones) in the outer shell's manifest?

What Jean-Baptiste did is pretty much also what I did and my conclusions were approximately the same. I did try to publish twice though and that didn't work either. I'll post a reproduction of that shortly

@asollberger if you're using dynamic hosts, a dirty trick would be to call initFederation('/assets/federation.manifest.json') where you export your 'request app' routes.
If hasRemote was exported, it would allow a slightly less messy approach:
if (!hasRemote('<known remote>')) { // <-- e.g. 'parties'
    initFederation('/assets/federation.manifest.json');
}

Here's my version of what I'm trying to achieve:
https://github.com/asollberger/nested-native-federation
I tried

double manifests, didn't work because it tried to load the same dependencies again (shared ones like @angular/core)
tried a reinit (initFederation) of the same one (same problem as above)

@JBBianchi I tried your suggestion. It did load another importmap-shim and added all the dependcies in there again, which caused duplicate errors.
For the moment I'm solving my immediate issue through this construct:
export const shellRoutes: Routes = [
  {path: '', pathMatch: 'full', redirectTo: 'request/8/party'},
  {path: 'request-component', loadComponent: () => loadRemoteModule('request', './RequestComponent').then((m) => m.RequestComponent)  },
  {
    path: 'request/:id',
    loadComponent: () => loadRemoteModule('request', './RequestComponent').then((m) => m.RequestComponent),
    children: [
      {path: 'party', loadChildren: () => loadRemoteModule('@cob/request-parties', './request-parties-routes').then((m) => m.requestPartyRoutes)}
    ]
  },
    { path: 'request-router', loadChildren: () => loadRemoteModule('request', './request-routes').then((m) => m.requestRoutes)}
]

... but that's just obviously not solving the issue

@asollberger that's unfortunate. I saw the duplicate errors in my console but it didn't seem to have an impact and it seemed to work as intended in the end.
What about something along the lines of the following?
await loadManifest('/assets/federation.manifest.json')
  .then(processRemoteInfos);

It should populate remoteNamesToRemote without messing with the importmap.

I have following situation:
shell (dynamic host) -> remote-1 (remote/dynamic host) -> remote-2 (remote)
I resolved your issue by having  remote-1 load global manifest before calling loadRemoteModule. This does require to have all remotes defined in single manifest.
See https://github.com/wrckt/native-federation-decorators/blob/pre-esm-poc/apps/remote-1/src/app/app.routes.ts
This allows loading nested remote routes via shell (ie. http://shell/remote-1/remote-2)
Hope this helps!

Awesome. Yes, this is the current way of solving this. Thanks for providing an example.

Thank you all for your comments, I truly appreciate all the feedback and help.
@mchlbrnd:
I do agree with @JBBianchi, the initFederation does too much and leaves errors in the console (though it does seem to work):
... for development that might be acceptable for a while, but not for production
Error: Rejected map override "@angular/animations" from http://localhost:4200/_angular_animations-17_0_3-dev.js to ./_angular_animations-17_0_3-dev.js.
    at resolveAndComposePackages (es-module-shims.js:248:15)
    at resolveAndComposeImportMap (es-module-shims.js:201:7)
    at es-module-shims.js:925:23

The solution @JBBianchi provided with processRemoteInfo so far looks like the cleanest solution and does not have the override issue, thanks @JBBianchi.
It even works when splitting the manifest into pieces, the only issue with that (which kind of defeats the purpose of splitting it) is that you have to define the middleman's manifest in the shell. A way around that would be to explicitely load the manifest from the remote itself and for that I'd need to retrieve the remote's url:
while this doesn't find the manifest file:
https://localhost:4200/assets/navigation.federation.manigest.json
this call would find it:
https://localhost:4202/assets/navigation.federation.manigest.json
Another issue I noticed with all of the solution so far is the angular component id collision issue:
_angular_core-17_0_3-dev.js:1157 NG0912: Component ID generation collision detected. Components '_ClientNavigationComponent' and '_ClientNavigationComponent' with selector 'nav-client-navigation' generated the same component ID. To fix this, you can change the selector of one of those components or add an extra host attribute to force a different ID. Find more at https://angular.io/errors/NG0912_angular_core-17_0_3-dev.js:1157 NG0912: Component ID generation collision detected. Components '_ClientNavigationComponent' and '_ClientNavigationComponent' with selector 'nav-client-navigation' generated the same component ID. To fix this, you can change the selector of one of those components or add an extra host attribute to force a different ID. Find more at https://angular.io/errors/NG0912

It happens when the same remote is attached in different places:

calling the account directly from the shell
calling the account through the navigation remote
I think this scenario will need some investigation, though it's not an issue for me at the moment.

I tried to initialize and pass a host attribute, initialized it before the call to the AppComponent and still got the warning.

initFederation should indeed only be called once. That means the remotes you load should not call it.
Shell:
[main.ts] --> [AppComponent]
                                  | Federation
MFE 1:                       V
[main.ts] --> [AppComponent]
                                  | Federation
MFE 2:                       V
[main.ts] --> [AppComponent]

Here, main.ts would call initFederation, hence it's only called once.
And if MFE 2 is mentioned in the Shell's manifest, it should work.

My case might be slightly different, as I was only trying to render a component from "remote-2" inside "remote-1" other than in the "host/shell". I managed to get this to work simply by doing this in "remote-1":
// my-component.html
[...]
<ng-container #remote2Component></ng-container>
[...]

// my-component.ts
@Component({
  [...]
})
export class MyComponent implements OnInit, AfterViewInit {

  @ViewChild('remote2Component', { read: ViewContainerRef, static: true }) viewContainer: ViewContainerRef | undefined;

  ngOnInit() {
    // [...]
  }

  async ngAfterViewInit(): Promise<void> {
    this.viewContainer?.clear();

    // this will load shell manifest, which in my case is totally fine
    // otherwise this can be configured to load local manifest, but it will need
    // full url "https://remote-1-url/assets/manifest.json
    await loadManifest('/assets/manifest.json').catch((err) => console.error(err));
    const m = await loadRemoteModule({
      type: 'manifest',
      remoteName: 'remote-2',
      exposedModule: './Remote2Component'
    });

    const instance = this.viewContainer?.createComponent(m.Remote2Component);
    // can interact with instance
    // console.log(instance);
  }
}

I guess a very similar approach can be used for routes.

authors: JBBianchi asollberger gigadie manfredsteyer mchlbrnd


text:
npm run build wont stop at errors

With what library do you have an issue?
native-federation
Reproduction of the bug/regression with instructions
Hello, if a have an html error like NG8002, npm run build --prod show the errors but the process is not stopped. It's annoying in ci ...
Expected behavior
The process should be stopped
Versions of Native/Module Federation, Angular, Node, Browser, and operating system
@angular-architects/native-federation : 17.1.6
@angular/core : ^17.2.0
Other information
No response
I would be willing to submit a PR to fix this issue

[ ] Yes
[ ] No

We would require a reproduciable Stackblitz (see link in Issue template)

authors: petetina rainerhahnekamp


text:
Change floor or ceil after create.

Is it possible to change option.floor and option.ceil after create component?

Oh, sorry.
I'm so inconsiderate. This is a duplicate.


text:
Error: b.DATETIME_FORMATS.STANDALONEMONTH is undefined

Bug description:
I keep getting the error Error: b.DATETIME_FORMATS.STANDALONEMONTH is undefined when I use the datepicker. I stripped everything out of my directive and even the bare minimum of the datepicker code like below throws this error when its loaded. Tried it from Mac:
return {
              restrict: 'A',
              replace: true,
              template: '<p>' +
                            '<input type="text" name="dob" class="form-control" placeholder="Date of Birth" uib-datepicker-popup />' +
                        '</p>',
          }

Version of Angular, UIBS, and Bootstrap
Angular: 1.4.8
UIBS: 2.3.0
Bootstrap: 3.3.7

The error only seems to happen with Angular 1.4.x version. The error did not show after updating Angular from 1.4.8 to 1.5.9.

The documentation mentions that it is only usable with Angular 1.5 - are you trying to use this feature with Angular 1.4, or is it erroring regardless?

Figured out exactly why this failed, will push up fix shortly & cut a release.

authors: Mr-Anonymous wesleycho

repo: angular-ui/bootstrap


text:
Grid not loading data in angular bootstrap modal popup window.

Grid not loading data in ui but total count is showing correctly.  Grid looking like below.
I have tried  $timeout(function () { ...}, 1000)  and $scope.$apply() everything. But no luck.

it is loading properly  after Ctrl + scroll action.

Note. I am trying to load this grid inside angular bootstrap Model.
https://angular-ui.github.io/bootstrap/#/modal

Could you provide a plunker?  It is logically something different in your code, since this works in the tutorials, but without seeing that code running it's hard to provide input.

Plunker is not working in my machine.. I am working in jsbin. Let you know the url soon...
Sorry for late reply.

Hi Paul,
I got the solution for this problem.
enableRowHeaderSelection  was false. Thats why it was not showing in model popup. I don't know the relationship b/w model popup and this field. other place are working fine without any issue.
I missed  attribute on top in index.html file. thats why i got more space to grid header. Now I fixed that problem also.
Plunker did not work in my machine. anyway, i am fine with this solution.
Thanks for your support.

I have given the width like  number ,  percentage, and  '*' for auto (as follows.) . In normal screen it shows properly. but in bootstrap modal, initial load its look like shrinked. after Ctrl + scroll, its realigned automatically.
columnDefs: [
{ name: 'id', width: '50' },
{ name: 'name', width: '20%' },
{ name: 'age', displayName: 'Age (no focus)', allowCellFocus: false, width: '100' },
{ name: 'address.city', width: '150' },
{ name: 'phone', width: '15%' },
{ name: 'company', width: '100' },
{ name: 'email', width: '150' },
{ name: 'balance', width: '100' },
{ name: 'guid', width: '*' }
]

Bootstrap modal runs an animation on render, and so the point the grid is rendering the modal is not yet full size.  The modal tutorial shows how to use handleWindowResize from a $timeout to deal with this.

Hi Paul,
Yes. This issue is fixed.
Just called the following method.  :)
$scope.gridApi.grid.handleWindowResize().
Thank you Paul.

I'm still facing this technical challenge. We have a modal which has UI grid in it. On click of a button we are trying to load the data for Grid. Ajax request is successful, but data is not being displayed on Grid. Only on CTRL+SCROLL or on resize of browser data appears on the Grid. Any suggestion plz?

Finally.... Adding 'ui.grid.autoResize' in the angular.module(...) solved this challenge for me.
Thank you :)

repo: angular-ui/ng-grid


text:
ui-select-no-choice isn't displayed

I have already downloaded the version 0.17.1, the directive "uiSelectNoChoice" is in file "dist/select.js", but when the search returns no results, it does not appear.
Doesn't work with ui-select add no-choice, plunker link.
My code:
<ui-select ng-model="elementExtensions.ator" theme="bootstrap" fix-focus-ui-select>     <ui-select-match allow-clear="true" placeholder="{{::'TYPE_FOR_SEARCH' | translate}}">       {{$select.selected.name}}     </ui-select-match>     <ui-select-choices refresh="loadAsyncActors($select.search)" refresh-delay="300"                        repeat="actor in actorPropertyViewControl.availableActors">

     </ui-select-choices>     <ui-select-no-choice>       Dang! We couldn't find any choices...     </ui-select-no-choice>   </ui-select>
HTML:

The select.js/select.css in your plunkr are outdated (v0.16.1) can you update to latest versions? (You can use the files from the /dist/ here in the repo)
Thanks!

Updated.

Seems like a duplicate of https://github.com/angular-ui/ui-select/issues/1608, no?

No, i'm using bootstrap theme.

My mistake. Using 1.7.1 I am able to get it to display, but I can't figure out what's wrong with the plunkr at the moment.

Strange. The directive is working fine with inline templates but not with external ones. Here’s a plunk.

repo: angular-ui/ui-select


text:
ui-select doesn't work with angular 1.2.18 and next versions

Hi,
I'm testing ui-select to be used in my app, but when i try to use with angular 1.2.18 or next, ui-select doesn't show correctly the options.
Using this punker:
http://plnkr.co/edit/Hijaxg?p=preview
and changing these imports :

happend this:

Thank you in advance.

Closing this issue as over a year old and may have been resolved in more recent versions.
If you believe its still relevant please reopen with a plunkr (or similar) against the latest version of ui-select (currently v0.15.0)


text:
Turning off AOT in angular.json for production does not work at runtime

I'm submitting a...
[X] Bug report

Current behavior
main.331a9edcffa8ca2717f0.js:1 Uncaught Error: Unexpected value 'e' imported by the module 'function(){}'. Please add a @NgModule annotation.
    at ka (main.331a9edcffa8ca2717f0.js:1)
    at main.331a9edcffa8ca2717f0.js:1
    at Array.forEach (<anonymous>)
    at e.getNgModuleMetadata (main.331a9edcffa8ca2717f0.js:1)
    at e._loadModules (main.331a9edcffa8ca2717f0.js:1)
    at e._compileModuleAndComponents (main.331a9edcffa8ca2717f0.js:1)
    at e.compileModuleAsync (main.331a9edcffa8ca2717f0.js:1)
    at e.compileModuleAsync (main.331a9edcffa8ca2717f0.js:1)
    at e.bootstrapModule (main.331a9edcffa8ca2717f0.js:1)
    at Object.zUnb (main.331a9edcffa8ca2717f0.js:1)

Expected behavior
It should work.
Minimal reproduction of the problem with instructions
ng new MyProject
cd MyProject
EDIT line "aot": true, replace by "aot": false
ng serve --configuration production

Navigate to http://localhost:4200/
What is the motivation / use case for changing the behavior?

Environment

Angular version: 6.0.3
Windows 10.

https://github.com/angular/angular/issues/24450

repo: angular/angular-cli


text:
Module build failed: TypeError: Cannot read property '_statSync' of undefined

Bug Report or Feature Request (mark with an x)
- [x ] bug report -> please search issues before submitting
- [ ] feature request

Command (mark with an x)
- [ ] new
- [x ] build
- [ ] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions
Angular CLI: 1.7.4
Node: 8.12.0
OS: linux x64
Angular: 5.2.11
@angular/cli: 1.7.4
@angular/forms: 5.2.10
@angular-devkit/build-optimizer: 0.3.2
@angular-devkit/core: 0.3.2
@angular-devkit/schematics: 0.3.2
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.2
@schematics/angular: 0.3.2
@schematics/package-update: 0.3.2
typescript: 2.4.2
webpack-node-externals: 1.7.2
webpack: 3.12.0
Repro steps
@angular/cli: 1.7.4
ng new app-ng5
ng build -prod

The log given by the failure
ERROR in ./src/app/app.module.ngfactory.js
Module build failed: TypeError: Cannot read property '_statSync' of undefined
at stat (/projects/test/app-project/node_modules/@ngtools/webpack/src/virtual_file_system_decorator.js:26:29)
at toDepDetails (/projects/test/app-project/node_modules/cache-loader/dist/index.js:66:5)
at arrayIterator (/projects/test/app-project/node_modules/neo-async/async.js:3780:9)
at timesSync (/projects/test/app-project/node_modules/neo-async/async.js:2292:7)
at Object.mapLimit (/projects/test/app-project/node_modules/neo-async/async.js:3775:5)
at Array. (/projects/test/app-project/node_modules/cache-loader/dist/index.js:89:18)
at arrayEachFunc (/projects/test/app-project/node_modules/neo-async/async.js:2512:19)
at Object.parallel (/projects/test/app-project/node_modules/neo-async/async.js:6867:9)
at Object.loader (/projects/test/app-project/node_modules/cache-loader/dist/index.js:88:9)
ERROR in ./node_modules/core-js/es7/reflect.js
Module build failed: TypeError: Cannot read property '_statSync' of undefined
at stat (/projects/test/app-project/node_modules/@ngtools/webpack/src/virtual_file_system_decorator.js:26:29)
at toDepDetails (/projects/test/app-project/node_modules/cache-loader/dist/index.js:66:5)
at arrayIterator (/projects/test/app-project/node_modules/neo-async/async.js:3780:9)
at timesSync (/projects/test/app-project/node_modules/neo-async/async.js:2292:7)
at Object.mapLimit (/projects/test/app-project/node_modules/neo-async/async.js:3775:5)
at Array. (/projects/test/app-project/node_modules/cache-loader/dist/index.js:89:18)
at arrayEachFunc (/projects/test/app-project/node_modules/neo-async/async.js:2512:19)
at Object.parallel (/projects/test/app-project/node_modules/neo-async/async.js:6867:9)
at Object.loader (/projects/test/app-project/node_modules/cache-loader/dist/index.js:88:9)
ERROR in ./node_modules/@angular/platform-browser/esm5/platform-browser.js
Module build failed: TypeError: Cannot read property '_statSync' of undefined
at stat (/projects/test/app-project/node_modules/@ngtools/webpack/src/virtual_file_system_decorator.js:26:29)
at toDepDetails (/projects/test/app-project/node_modules/cache-loader/dist/index.js:66:5)
at arrayIterator (/projects/test/app-project/node_modules/neo-async/async.js:3780:9)
at timesSync (/projects/test/app-project/node_modules/neo-async/async.js:2292:7)
at Object.mapLimit (/projects/test/app-project/node_modules/neo-async/async.js:3775:5)
at Array. (/projects/test/app-project/node_modules/cache-loader/dist/index.js:89:18)
at arrayEachFunc (/projects/test/app-project/node_modules/neo-async/async.js:2512:19)
at Object.parallel (/projects/test/app-project/node_modules/neo-async/async.js:6867:9)
at Object.loader (/projects/test/app-project/node_modules/cache-loader/dist/index.js:88:9)
ERROR in ./node_modules/zone.js/dist/zone.js
Module build failed: TypeError: Cannot read property '_statSync' of undefined
at stat (/projects/test/app-project/node_modules/@ngtools/webpack/src/virtual_file_system_decorator.js:26:29)
at toDepDetails (/projects/test/app-project/node_modules/cache-loader/dist/index.js:66:5)
at arrayIterator (/projects/test/app-project/node_modules/neo-async/async.js:3780:9)
at timesSync (/projects/test/app-project/node_modules/neo-async/async.js:2292:7)
at Object.mapLimit (/projects/test/app-project/node_modules/neo-async/async.js:3775:5)
at Array. (/projects/test/app-project/node_modules/cache-loader/dist/index.js:89:18)
at arrayEachFunc (/projects/test/app-project/node_modules/neo-async/async.js:2512:19)
at Object.parallel (/projects/test/app-project/node_modules/neo-async/async.js:6867:9)
at Object.loader (/projects/test/app-project/node_modules/cache-loader/dist/index.js:88:9)
ERROR in ./node_modules/@angular/core/esm5/core.js
Module build failed: TypeError: Cannot read property '_statSync' of undefined
at stat (/projects/test/app-project/node_modules/@ngtools/webpack/src/virtual_file_system_decorator.js:26:29)
at toDepDetails (/projects/test/app-project/node_modules/cache-loader/dist/index.js:66:5)
at arrayIterator (/projects/test/app-project/node_modules/neo-async/async.js:3780:9)
at timesSync (/projects/test/app-project/node_modules/neo-async/async.js:2292:7)
at Object.mapLimit (/projects/test/app-project/node_modules/neo-async/async.js:3775:5)
at Array. (/projects/test/app-project/node_modules/cache-loader/dist/index.js:89:18)
at arrayEachFunc (/projects/test/app-project/node_modules/neo-async/async.js:2512:19)
at Object.parallel (/projects/test/app-project/node_modules/neo-async/async.js:6867:9)
at Object.loader (/projects/test/app-project/node_modules/cache-loader/dist/index.js:88:9)

Linked to cache-loader, see https://github.com/webpack-contrib/cache-loader/issues/46#issuecomment-434596692

Resolved the issue by installing cache-loader version 1.2.2.

Thanks guys :+1:

Yeah if will add "cache-loader": "1.2.2" " in package.json.

It worked for me too. Thank you very much

authors: H--o-l abhinavJai charlesgathu pierregouret santoshyadav198613


text:
Add command to create empty file

OS?
Mac OSX Sierra
Versions.
angular-cli: 1.0.0-beta.21
node: 6.9.1
os: darwin x64
Suggestion
Add "ng g e bar" command that creates an empty file with .ts as default extension
Useful for creating files that there are no templates for.
e.g.
typings.d.ts
rxjs-extensions.ts
This might useful for creating scripts that generate projects, like this
# ng new event-view -p ev -sn
#####################
cd event-view
echo *** turn off spec generation ***
ng set defaults.spec.class false
ng set defaults.spec.component false
ng set defaults.spec.directive false
ng set defaults.spec.module false
ng set defaults.spec.pipe false
ng set defaults.spec.service false
echo *** work on the shared folder ***
ng g m core
rm src/app/core/core.component.*
ng g s core/auth-guard
ng g cl core/can-deactivate-guard
ng g cl core/config
rm src/app/core/config.spec.ts
ng g s core/entity
ng g s core/exception
ng g s core/message
ng g s core/module-import-guard
ng g cl core/preload-strategy
ng g cl core/rxjs-extensions
ng g s core/user-profile
ng g m core/modal
ng g s core/modal
ng g m core/nav
ng g m core/spinner
ng g s core/spinner
ng g m core/toast
ng g s core/toast
ng g cl core/rxjs-operators
...

uhm, disagree strongly, what's wrong with just using "touch suchandsuch.satan"?

Does 'touch foo.txt` work in Windows?

so now we have to write Powershell scripts for the most profoundly retarded
people in the development community?
On Sat, Dec 3, 2016 at 10:46 AM, John Papa notifications@github.com wrote:

Does 'touch foo.txt` work in Windows?
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/angular/angular-cli/issues/3373#issuecomment-264650372,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAoqo_jf7kQYnB_YiA9DlZKw3fzdrrJcks5rEZzSgaJpZM4LDU7b
.

I feel the CLI should work the same (as close as we can) on either OSX or Windows. This way we can create scripts that work in either environment and generate projects. This feature would help that parity.
If the team choose this is not valuable, I'm fine with that. These are suggestions.
But please keep your comments respectful @digimax .

Pardon my ego. It doesn't belong here. I'm putting it away right now. FREE ADVICE for people doing ANY KIND OF SOFTWARE DEVELOPMENT WHAT SO EVER: cygwin!

thanks for all the negative karma you are creating by posting a picture of an inverted thumb. much appreciated. keep it coming.

GitHub comments are for technical commentary, @digimax. Please be respectful of everyone's time and efforts by not polluting an issue with non-technical commentary. You can delete your comments above...

again, you re hoeless ghey. an no one cares about you. not even you mother
prolly. i'll fork this bitch and then I squish your head. f u.
On Sat, Dec 3, 2016 at 2:09 PM, Jan Nielsen notifications@github.com
wrote:

GitHub comments are for technical commentary, @digimax
https://github.com/digimax. Please be respectful of everyone's time and
efforts by not polluting an issue with non-technical commentary. You can
delete your comments above...
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/angular/angular-cli/issues/3373#issuecomment-264662438,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAoqo1NMqmb48N9jQtjmCAInp8KZcNlGks5rEcxzgaJpZM4LDU7b
.

I've deleted comments on this issue that were in violation of Angular's Code of Conduct and banned the user in question.

I see how it can be useful as a simple command for scripts, and as something of a conceptual proto generator. In the future it would be nice to extend the AST codegen to create all generators from a base one and this could be it.
What do you think @Brocco?

@naomiblack thank you :)

I struggle to see the usefulness of this feature. The power of blueprints IMO are to create boilerplate code to get you coding faster. All IDEs/editors provide this functionality, so I struggle to see the added benefit of adding it into the CLI. I'm not against it, just not convinced based upon the script example from @johnpapa above.
Using a script to create an application is something that very few people will actually use, especially when that script could do the same thing via touch bar.ts.

@johnpapa -- could you use echo $null >> somefile.ts to create your empty file? This should work on OSX and Windows as well as Linux, but I can only vouch for Linux... To me, folding this type of work into Angular CLI moves away from the tool's core mission, but I have the luxury of only needing Linux. :-D

The only use case I have for this is scripting for file creation. If that is not something in scope, I agree that this can be closed @Brocco .
I'm fine using OS commands to do it, if there are no other requests for it.
Feel free to close if you wish

Closing for now, but if there's more feedback about adding this feature we can re-evaluate.

authors: Brocco JanStureNielsen deebloo digimax filipesilva johnpapa naomiblack


text:
Enhancement: ng g -help should show help for all blueprints

OS?
Mac OSX Sierra 10.12.3
Versions.
@angular/cli: 1.0.0-rc.1
node: 6.9.1
os: darwin x64
@angular/common: 2.4.9
@angular/compiler: 2.4.9
@angular/core: 2.4.9
@angular/forms: 2.4.9
@angular/http: 2.4.9
@angular/platform-browser: 2.4.9
@angular/platform-browser-dynamic: 2.4.9
@angular/router: 3.4.9
@angular/cli: 1.0.0-rc.1
@angular/compiler-cli: 2.4.9
Repro steps.
ng g -h
The log given by the failure.
Invalid blueprint: -h
Mention any other details that might be useful.
It would be super helpful to have this list the availalble blueprints

While you're on it, I think that there should be a help command for ng g, right now it throws an error
Invalid blueprint: -h

but ng g component -h works (and prints the help for all blueprints, not just component)

authors: johnpapa ocombe


text:
I need to save SCSS file twice for refreshing page

Bug Report
- [x] bug report -> please search issues before submitting
- [ ] feature request

CLI Version
@angular/cli: 1.0.0
node: 7.8.0
os: darwin x64
@angular/common: 4.0.1
@angular/compiler: 4.0.1
@angular/core: 4.0.1
@angular/forms: 4.0.1
@angular/http: 4.0.1
@angular/platform-browser: 4.0.1
@angular/platform-browser-dynamic: 4.0.1
@angular/router: 4.0.1
@angular/cli: 1.0.0
@angular/compiler-cli: 4.0.1

Repro steps.

ng set packageManager=yarn --global
ng new MyProj --style scss -sd client
yarn
make a directory named scss that will included some global style

And now i got a direcotry like this
├── app/
│   ├── app.component.html
│   ├── app.component.scss
│   ├── app.component.spec.ts
│   ├── app.component.ts
│   ├── app.module.ts
├── assets/
├── environments/
│   ├── environment.prod.ts
│   └── environment.ts
├── favicon.ico
├── index.html
├── main.ts
├── polyfills.ts
├── scss/
│   ├── colors.scss
│   ├── entry.scss
│   ├── fonts.scss
│   ├── mixins.scss
│   └── variables.scss
├── styles.scss
├── test.ts
├── tsconfig.app.json
├── tsconfig.spec.json
└── typings.d.ts

Add a variable in scss/colors.scss

$blue: #28a;

Import colors.scss and reference the variable $blue in file app/app.component.scss

@import '../scss/colors';
h1 {
    color: $blue
}

After all above step, i changed the value of $blue, and saved what i have changed. I noticed that browser have refreshed, but nothing change. But if i saved the same file again without any change, i found the browser refreshed and show me what i expected.
The log given by the failure.

Saved file first time, i got this log:

[0] Hash: 1ccd1622b72d31261e5f
[0] Time: 802ms
[0] chunk    {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 158 kB {4} [initial]
[0] chunk    {1} main.bundle.js, main.bundle.js.map (main) 21.6 kB {3} [initial]
[0] chunk    {2} styles.bundle.js, styles.bundle.js.map (styles) 9.89 kB {4} [initial]
[0] chunk    {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 1.4 MB [initial]
[0] chunk    {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry]
[0] webpack: Compiled successfully.

Saved file second time without any change, i got this log:

[0] Hash: b02ca63f909fa66d4868
[0] Time: 830ms
[0] chunk    {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 158 kB {4} [initial]
[0] chunk    {1} main.bundle.js, main.bundle.js.map (main) 21.6 kB {3} [initial] [rendered]
[0] chunk    {2} styles.bundle.js, styles.bundle.js.map (styles) 9.89 kB {4} [initial]
[0] chunk    {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 1.4 MB [initial]
[0] chunk    {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry]
[0] webpack: Compiled successfully.

You must notice that there one more symbol [rendered] after i saved file 2nd time
Desired functionality.
Is there anybody who can tell me how to solve that, or point out my fault. Thank you, guys. lol

maybe: http://stackoverflow.com/questions/34213253/webpack-watch-not-working-on-webstorm-on-windows

@taozhiw Actually, I use VSC as my code editor. After read your repost and link, i should say my problem does not match those answers.
This is my development env:

OS: macOS Sierra
Editor: VSC 1.11.0
Node: 7.8.0
Angular-cli: 1.0.0

From my personal experience, I'm sure that's webpack's issue.

@MRokas But how to solve it?

@evmar May this issue has the same one?

@MRokas , I found i could get correct refreshing by webpack, you can check via ng-admin . May be i should give up ng-cli

I could not reproduce this issue. I initialized a new project, and using VSCode, the second I hit save after adding the code below the page updated with the new color.:
@import '../scss/colors';
h1 {
   color: $blue
}

Perhaps this was fixed in recent versions, all I know is that it doesn't happen anymore.
If you're still experiencing this, have a look at https://github.com/angular/angular-cli/issues/1610. Maybe the cause for your issue is listed there.

This has been here a while and already closed, but I ran into this issue and wanted to leave my solution here to help other who may arrive here looking for answers.
My exact problem was that I had to save any of my scss files twice, on the first time the page was refreshing, but the css changes would not apply, only with a second save.
The problem for me was having the aot flag set to true under options in my angular.json file:
"options": {
    "outputPath": "dist/browser",
    "index": "src/template.html",
    "main": "src/main.ts",
    "polyfills": "src/polyfills.ts",
    "tsConfig": "tsconfig.app.json",
    "aot": true,
    "assets": ["src/favicon.ico", "src/assets"],
    "styles": [
           "node_modules/prismjs/themes/prism.css",
           "node_modules/prismjs/themes/prism-twilight.css",
           "node_modules/prismjs/plugins/toolbar/prism-toolbar.css",
           "src/styles.scss"
     ],
     ...
}

Removing it or setting it to false salved my problem.
Help it helps!

authors: MRokas R0rs12ach filipesilva layoutzweb taozhiw


text:
Angular cli Generates Wrong Directory Path in app.module.ts

Bug Report or Feature Request (mark with an x)

[x] bug report
[ ] feature request

Versions.
node -v : v6.10.0
npm -v : 5.3.0
ng -v :
@angular/cli: 1.2.4
node: 6.10.0
os: darwin x64

Repro steps.

install the latest angular-cli (version : 1.2.4)
go in the desired repository
run the command ng new myProject
go in the created project
go in myProject/src/app and create a folder "common"
go in "common" folder
run ng g c myComponent

The log given by the failure.

the component is created at the right location :

installing component
  create src/app/common/my-component/my-component.component.css
  create src/app/common/my-component/my-component.component.html
  create src/app/common/my-component/my-component.component.spec.ts
  create src/app/common/my-component/my-component.component.ts
  update src/app/app.module.ts

but the path written in "app.module.ts" is wrong

ERROR in /Users/u.name/myProject/src/app/app.module.ts (5,38): Cannot find module './common/src/app/common/my-component/my-component.component'.

ERROR in ./src/app/app.module.ts
Module not found: Error: Can't resolve './common/src/app/common/my-component/my-component.component' in '/Users/u.name/myPoject/src/app'
 @ ./src/app/app.module.ts 10:0-99
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

Desired functionality.
The path written is constantly adding "src/app" part whereas older version of the cli did not have this behavior
The correct import statement should be :
import { MyComponentComponent } from './common/my-component/my-component.component';
Mention any other details that might be useful.
This issue has also been reported on StackOverflow by another user :
https://stackoverflow.com/questions/45293787/angular-cli-generates-wrong-directory-path-in-app-module-ts

Not only in app.module.ts. i have nested modules that contains components which i generate using the command ng g c <component_name>. What happens is that it prepends the import path with ./src/app. It should be ./ or ./<current_working_directory>.
Versions.
@angular/cli: 1.2.4
node: 6.11.0
os: darwin x64
@angular/animations: 4.3.1
@angular/common: 4.3.1
@angular/compiler: 4.3.1
@angular/core: 4.3.1
@angular/forms: 4.3.1
@angular/http: 4.3.1
@angular/platform-browser: 4.3.1
@angular/platform-browser-dynamic: 4.3.1
@angular/router: 4.3.1
@angular/cli: 1.2.4
@angular/compiler-cli: 4.3.1
@angular/language-service: 4.3.1

i have the same issue

+1

me too

@Brocco can you have a look?

I've checked on an older angular-cli version and found one that didn't had the issue :
angular-cli 1.0.6 didn't had this generated path issue

@djtahl same case with me, it was working fine with 1.0.6 but after updating to 1.2.4 it's giving wrong relative path.

I am facing one more issue related to this. After updating to 1.2.4, the import statement of environment file is changed to
import { environment } from 'environments/environment';
and i had make it relative again manually at every place.

Any news about this ?
There is currently 3 major problems with generation (this one, #6533 and #7061). Some of them dating from several weeks ago, and I'm quite worried to see new versions of the CLI released without any fix for these major regressions. I tried to help with a PR for one of them, posted one month ago, but which has been completely ignored.
Speed is nice, but a working tool should be a priority. Currently the generation has become so buggy I'm starting to think about stopping to use it during the trainings I do...

+1

1.3.0 still same..

Same problem! Terrible!

Guys, please, fix this problem before moving any further!

same problem

@djtahl OMG thank you, I just changed it to the right path. Not a nice thing to get when your just new to it.

This issue has been fixed in the master branch. However, the issue still exist in 1.3.x and 1.4.x branch.

Fixed via https://github.com/angular/angular-cli/pull/7090

same problem :(

This issue was fixed in 1.4.0, but not 1.3. We are looking at fixing it in 1.3 as well.

Great! Thanks @hansl !

authors: AndonyNS Cornevur INGCRENGIFO Itisfilipe SeanConnell93 andrewkww cyrilletuzi deveshjadon98 djtahl exequiel09 filipesilva fsx999 hansl hiepxanh keatkeat87 miguelcaravantes


text:
fix(build): remove non existent bundle and fix RxJS path

Current build is broken:

This PR fixes it.

It turns out that it's working properly. I should have missed a npm link

:-) it bit me before as well

authors: IgorMinar cironunes


text:
feat(@schematics/update) import user-agent from NPM config

Configuration of the user-agent header in requests is a commonly available feature; previous versions of angular-cli do not pull this value from NPM.

@clydin any thoughts? A few other projects are particular about how and if their user-agent headers can be customized, wanted to know if there's already been a precedent or discussion about this.


text:
fix(aot): add baseurl and fix module resolution.

loadChildren resolution now uses the same resolution as imports (using the TypeScript language service).

This should fix our nightly e2e tests. The theory is that nightly changed the version of TypeScript and TS itself changed the way it resolves modules. We don't know for sure but Angular Core itself didn't change its logic WRT this issue.

Not sure if it's related but the CLI's webpack module resolution was changed via this PR: #1875

authors: clydin hansl


text:
(docs): update rc.0 guide to note tsconfig entry change

When the tsconfig file names are changed using this guide we also need to update the old app.tsconfig entry to reflect the new file names

sorry, this is already reflected later on in the guide.


text:
$interval

The version of 1.2.28 works fine but the 1.3.X version doesn't work in this code
<!DOCTYPE html>

	<meta charset="utf-8">

{{time}}

The code does work fine in version 1.2.28, but in 1.3.X version it does not work.
Can anyone tell me how i can fix this problem?

your issue is that in 1.3, by default, you can't use global functions as controllers (see https://github.com/angular/angular.js/commit/3f2232b5a181512fac23775b1df4a6ebda67d018#diff-39f7f76ebd18c5a040b9413a98410197). To work around this, you can enable global controllers via a config method (you would not be able to use an anonymous app to do this), eg http://plnkr.co/edit/KjNgzwJplP0n3xP3WMkp?p=preview --- alternatively, you can explicitly define the controller, like this: http://plnkr.co/edit/s6srm7DE3na3ly2Y9Haa?p=preview


text:
ng-animate transition problem using zurb foundation 5

Hi,
since angular version 1.2.17 I have a big animation problem that some operations are totally slowly. For instance some button components are using ng-show and are set to false, but the button is seen for a few Milli seconds.
Now I have found out, that ngAnimate is executing some css3 transitions from foundation5 html5 framework.
Here a live example:
http://plnkr.co/edit/uPtFwvamczzJFvz2dGmn
Thanks

This could also be from a CSS selector having a higher president in your code.. like
#some-parent #some-child{
    display: block;
}
#some-parent #some-child.ng-hide{
      display: none;
}

If removing the display:block; is not an option then define the .ng-hide for that element


text:
Input's FormControl setValue does not work when mat-form-field has chip-list and input is linked to autocomplete

Bug, feature request, or proposal:
Bug
What is the expected behavior?
Input's FormControl's setValue should work for an input that is inside a mat-form-field that has both autocomplete and chip-list.
What is the current behavior?
FormControl setValue does not work when the following iff a mat-form-field has an input that has matAutocomplete AND the mat-form-field has a mat-chip-list.
SetValue works if one removes the matAutocomplete directive from the input or removes the mat-chip-list element.
What are the steps to reproduce?
Demo should have the input incrementing a number every second, which doesn't work:
https://stackblitz.com/edit/angular-ay3yts?file=app%2Fautocomplete-simple-example.html
Deleting mat-chip-list or removing the matAutocomplete directive fixes the issue.
What is the use-case or motivation for changing an existing behavior?
I want to be able to programmatically add a chip then clear the input when an option in the autocomplete has been selected.
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular: 5.2.4
Material: 5.2.4
Is there anything else we should know?
Nope :)

The stackblitz does not appear to be set up correctly. The <input> needs a matChipInputFor directive rather than a matInput directive (see: https://material.angular.io/components/chips/overview). I also don't think setting a formControl on the input will add chips to the chipList
@tinayuangao is there a way to put a formControl on the mat-chip-list itself so they can update the chips by changing the formControl value?

Oops, how embarrassing! I had to recreate the stackblitz after accidentally navigating away from the first one. I've updated the stackblitz.
I'm not looking to add chips through form control, I just want to be able to have the input respond to FormControl's setValue calls. Right now, if you have both a mat-chip-list AND autocomplete, the input view will not respond to setValue. Try commenting out the mat-chip-list OR the autocomplete, you'll see that the input will once again respond to setValue and show a counter going up.

Hmm interesting. I made an expanded example that shows this working with other combinations of input and autocomplete but failing for chips + autocomplete. It must be some kind of bad interaction between the two components.
@crisbeto as well, as owner of autocomplete

I'm doing same, chips + autocomplete + Input. The purpose of a combination is allowing a user to select multiple options with searching using APIs (remote data).
Searching will populate autocomplete options and after selecting autocomplete option, I'm populating chip list selected items.
After selection of autocomplete item, value clearance is not working.
<mat-form-field class="demo-chip-list">
	<mat-chip-list #tolist>
		<mat-chip *ngFor="let user of selectedUser" [selectable]="true" [removable]="true">
			{{user.name}}
			<mat-icon matChipRemove>cancel</mat-icon>
		</mat-chip>
		<input matInput placeholder="New user..." type="text"
		name="to" formControlName="to"
		[matChipInputFor]="tolist"
		(matChipInputTokenEnd)="add($event)" />
	</mat-chip-list>
	<mat-autocomplete #auto="matAutocomplete" (optionSelected)="selected($event)" [displayWith]="displayFn">
		<mat-option *ngFor="let user of users" [value]="user">
			{{ user.name }}
		</mat-option>
	</mat-autocomplete>
</mat-form-field>

selected(event){
    this.selectedUser.push(event.option.value);
    this.composeForm.controls['to'].setValue('abc');
}

Hi,
I have the same issue. This causes the following behavior when using the chips with autocomplete example (https://stackblitz.com/angular/beoyjxqloag?file=app%2Fchips-autocomplete-example.ts):

Type "L"
Select a suggestion (ex: "Lemon")
Type "L" again
The suggestions are not shown. I guess it's because the valueChanges was not triggered (the field value is still "L")

Thanks,
Marc

Having the same issue here. Combining autocomplete and chips on a formField causes control.setValue(...) not to do anything.

Having the same issue here. Combining autocomplete and chips on a formField and using control.setValue(...) won't do anything.
Interestingly enough, valueChanges got triggered with the value that is used in control.setValue(...) (but is not displayed)

Check your displayFn, if not send more code maybe I can help, I've been searching for bug for hours and finally found it maybe I can help you too

Same issue here any solution?
The only workaround I found is to set the value manually:
<mat-form-field>
  <mat-chip-list #chipList>
    <mat-chip *ngFor="let value of selected">{{value}}</mat-chip>
    <input #inputRef
           placeholder="Input Name"
           [formControl]="inputFormControl"
           [matAutocomplete]="autocomplete"
           [matChipInputFor]="chipList"
           (matChipInputTokenEnd)="add($event.value)">
  </mat-chip-list>
  <mat-autocomplete #autocomplete (optionSelected)="add($event.option.viewValue)">
    <mat-option *ngFor="let value of values" value="{{value}}">{{value}}</mat-option>
  </mat-autocomplete>
</mat-form-field>

  inputFormControl = new FormControl('');
  @ViewChild('inputRef', {static: true}) inputRef: ElementRef<HTMLInputElement>;

  add(value: string): void {
    this.selected.push(value);
    this.inputControl.setValue('');
    this.inputRef.nativeElement.value = ''; // Won't work without this line
  }

Struggling with the same issue, and I think the underlying problem is that the matChipInputFor control doesn't get created as a FormControl type, but rather as an array type... as shown in the screenshot. As a result, the setValue method of course doesn't exist. I think it's fair to call this a bug.

@tim-kuteev thank you it works.  I had initially just put some javascript like (document.getElementById('id')).value = ' ';
But you do it the right way with viewchild in this case.  Thanks ! :)

I'm also encountering this issue. Generally it feels like the chip list and autocomplete do not work together perfectly. For example selected chips do not work in this scenario. Even if the chip has [selected]="true" it will simply not display as selected.

Any update on this issue?

I got the same issue , here's my code
<mat-chip-list #chipList>
                            <mat-chip
                                    *ngFor="let primer of element.selectedPrimers"
                                    [selectable]="true"
                                    [removable]="true"
                                    (removed)="removePrimer(element,primer)">
                                {{primer.name}}
                                <mat-icon matChipRemove *ngIf="true">cancel</mat-icon>
                            </mat-chip>
                            <input
                                    placeholder="选择载体..."
                                    [formControl]="primeSearchControl"
                                    [matAutocomplete]="auto"
                                    [matChipInputFor]="chipList"
                                    [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
                                    [matChipInputAddOnBlur]="false"
                                    (matChipInputTokenEnd)="clearInput()"
                            />

                            <mat-icon matSuffix (click)="endSelectPrimer(inplace)">done_all</mat-icon>
                        </mat-chip-list>

the
    clearInput() {
        this.primeSearchControl.setValue('', {emitEvent: false})
    }

method not work

As a workaround it is possible to define your own copy of the [matAutoComplete] directive, which doesn't provide NG_VALUE_ACCESSOR.
import { Directive, Input } from "@angular/core";
import { MatAutocomplete, MatAutocompleteTrigger } from "@angular/material/autocomplete";

/**
 * This hack is necessary because `MatAutocompleteTrigger` provides `NG_VALUE_ACCESSOR`,
 * which doesn't make any sense when used in combination with `MatChipInput`.
 */
@Directive({
  selector: `input[matChipAutocomplete], textarea[matChipAutocomplete]`,
  host: {
    'class': 'mat-autocomplete-trigger',
    '[attr.autocomplete]': 'autocompleteAttribute',
    '[attr.role]': 'autocompleteDisabled ? null : "combobox"',
    '[attr.aria-autocomplete]': 'autocompleteDisabled ? null : "list"',
    '[attr.aria-activedescendant]': '(panelOpen && activeOption) ? activeOption.id : null',
    '[attr.aria-expanded]': 'autocompleteDisabled ? null : panelOpen.toString()',
    '[attr.aria-owns]': '(autocompleteDisabled || !panelOpen) ? null : autocomplete?.id',
    '[attr.aria-haspopup]': '!autocompleteDisabled',
    // Note: we use `focusin`, as opposed to `focus`, in order to open the panel
    // a little earlier. This avoids issues where IE delays the focusing of the input.
    '(focusin)': '_handleFocus()',
    '(blur)': '_onTouched()',
    '(input)': '_handleInput($event)',
    '(keydown)': '_handleKeydown($event)',
  },
  exportAs: 'matAutocompleteTrigger'
})
export class MatChipAutocompleteTrigger extends MatAutocompleteTrigger {
  @Input('matChipAutocomplete')
  public set matChipAutocomplete(value: MatAutocomplete) {
    this.autocomplete = value;
  }
}

HI,
I am facing the same issue,
if i apply validator as "required" even when i enter fields it say formcontrol status as INVALID and value as null,

      {{fruit}}
      cancel

      {{ fruit }}

      {{fruit}}
      cancel

      {{ fruit1 }}

<button (click)="onSubmit()">submit
import {COMMA, ENTER} from '@angular/cdk/keycodes';
import {Component, ElementRef, ViewChild} from '@angular/core';
import {FormControl} from '@angular/forms';
import {MatAutocompleteSelectedEvent, MatChipInputEvent} from '@angular/material';
import {Observable} from 'rxjs';
import {map, startWith} from 'rxjs/operators';
/**

@title Chips Autocomplete
*/
@Component({
selector: 'chips-autocomplete-example',
templateUrl: 'chips-autocomplete-example.html',
styleUrls: ['chips-autocomplete-example.css']
})
export class ChipsAutocompleteExample {
visible: boolean = true;
selectable: boolean = true;
removable: boolean = true;
addOnBlur: boolean = false;

separatorKeysCodes = [ENTER, COMMA];
fruitCtrl = new FormControl();
filteredFruits: Observable<any[]>;
fruits = [
'Lemon',
];
allFruits = [
'Apple',
'Lemon',
'Lime',
'Orange',
'Strawberry'
];
@ViewChild('fruitInput') fruitInput: ElementRef;
constructor() {
this.filteredFruits = this.fruitCtrl.valueChanges.pipe(
startWith(null),
map((fruit: string | null) => fruit ? this.filter(fruit) : this.allFruits.slice()));
}
add(event: MatChipInputEvent): void {
const input = event.input;
const value = event.value;
// Add our fruit
if ((value || '').trim()) {
  this.fruits.push(value.trim());
}

// Reset the input value
if (input) {
  input.value = '';
}

this.fruitCtrl.setValue(null);

}
remove(fruit: any): void {
const index = this.fruits.indexOf(fruit);
if (index >= 0) {
  this.fruits.splice(index, 1);
}

}
filter(name: string) {
return this.allFruits.filter(fruit =>
fruit.toLowerCase().indexOf(name.toLowerCase()) === 0);
}
selected(event: MatAutocompleteSelectedEvent): void {
this.fruits.push(event.option.viewValue);
this.fruitInput.nativeElement.value = '';
this.fruitCtrl.setValue(null);
}
}

@mlewe Thank you so much! I was facing the same issue and danced around for hours until I found your workaround, which works perfectly for me.

This issue is still present in Angular v14.

The issue is still there in angular  and material 18.

Not fixed after 6 years...

authors: RSBlek ansaripwd bhaumikpandhi bskp ffredsh frankrc85 ivorobioff marcantoinebouchard mlewe mmalerba mswilson4040 nikagar4 njifares philmtd sarora2073 tim-kuteev towith twisha

repo: angular/components


text:
feat(COMPONENT): Styling an area to show that It's restricted after a cdkDrag

Feature Description
I want to be able to style a restricted area once a cdkDrag is made to show the Users that they can not make a cdkDrop in that zone.
Provide a brief summary of the feature you would like to see.
I tried to make the area [cdkDropListDisabled]= "true" and then style the .cdk-drop-list-disabled{} but this doesn't give the desired result because it styles the restricted area even before any cdkDrag Event. The desired result is that the restricted area is dynamically style upon cdkDrag and styling is removed after cdkDrop
Use Case
The Use case is for better User Experience to show the User what areas can be dropped in and what areas are restricted.
Describe the use case(s) that the proposed feature would enable.

You should be able to have [cdkDropListDisabled]="isDisabled" where isDisabled starts off as false and then you flip it to true after the first drop event.

I tried that It does not work . I want it disabled upon drag not drop.

Sorry for the delay, I think this got buried in the other notifications. So you're trying to change the cdkDropListDisabled when dragging starts? I think it might not be working because you have to trigger change detection for the value to be picked up.

Yes I am trying to change the cdkDropListDisabled when dragging starts, I attached  a (cdkDragStarted) on the cdkDrag that calls a dragStart() function.(cdkDragStarted)="dragStart($event)" .That solves the problem but I would believe there has to be a better solution

I urgently need a solution for this issue @crisbeto .

We're in the process of cleaning up our issue backlog. Given that there hasn't been any activity in two years, I'm assuming that the issue was resolved. Feel free to open a new issue if that's not the case.

authors: crisbeto samuelidehen


text:
bug(material/table): last row border inconsistency

Is this a regression?

[ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was
No response
Description
Tables with double header (column border and row border) have bottom border on the last row, but only below <th> elements. Table shown in the screenshot = Segment 1/2/3 is a columnheader, Region 1/2 is a rowheader and numbers are table data.

<td> elements have special CSS selector which deletes this border from the last row. Is the same rule missing for <th> elements?

Reproduction
Steps to reproduce:

Create a table with double header - column + row header
Observe last row's bottom border

Expected Behavior
Last row's bottom border is not present in both <td> and <th> elements - claimed here: https://material.angular.io/guide/mdc-migration#table
Actual Behavior
Last row border is not present in <td> elements and is present in <th> elements.
Environment

Angular: 16.2.0
CDK/Material: 16.2.0
Browser(s): Any
Operating System (e.g. Windows, macOS, Ubuntu): Windows 11 Pro

@magentaRE Could you provide a stackblitz reproduction?

@wagnermaciel Apologies, I forgot to create one. Here it is: https://stackblitz.com/edit/stackblitz-starters-yu5tvs?file=src%2Fmain.ts

authors: magentaRE wagnermaciel


text:
Datepicker formatting date to wrong century in IE/Edge

Bug, feature request, or proposal:
When manually typing a date with a 2 digit year, datepickers on IE or Edge formats the date to the wrong century.
Example: Type in 1/1/12 or 01/01/12
Works properly in chrome and firefox
What is the expected behavior?
Format the date to 1/1/2012
What is the current behavior?
the datepicker formats the date to 1/1/1912
What are the steps to reproduce?
Go to any of the datepickers and manually type in the date and then leave the field.
https://material.angular.io/components/datepicker/overview
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
IE11 and Edge

This is working as expected. See https://material.angular.io/components/datepicker/overview#choosing-a-date-implementation-and-date-format-settings. Specifically,

Please note: MatNativeDateModule is based off of the functionality available in JavaScript's native Date object, and is thus not suitable for many locales. One of the biggest shortcomings of the native Date object is the inability to set the parse format. We highly recommend using the MomentDateAdapter or a custom DateAdapter that works with the formatting/parsing library of your choice.

IE and Edge both parse "1/1/12" as "January 01 1912".

authors: Rob-Shnayder jelbourn


text:
headerPosition="below" does not effect nav mat-tab-nav-bar

Bug, feature request, or proposal:
Bug/Feature - Adding headerPosition="below" does not effect nav mat-tab-nav-bar; I would like it to cause the divider to appear above the labels.
What is the expected behavior?
The divider line should appear above the tab labels as it does for mat-tab-group.
What is the current behavior?
headerPosition="below" has no effect on nav mat-tab-nav-bar.
What are the steps to reproduce?
Add headerPosition="below" to a working mat-tab-nav-bar.
https://stackblitz.com/edit/angular-8lxwwf?file=app/tab-nav-bar-basic-example.html
What is the use-case or motivation for changing an existing behavior?
I'm trying to use the mat-tab-nav-bar as a bottom nav within my app and as such I'd like the tabs to appear below the divider line.
<router-outlet></router-outlet>

    {{link.label}}

nav {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
}

.spacer {
  padding-bottom: 50px;
}

The headerPosition attribute may not be the way to achieve this as it refers to placing the tab headers below the content; which is being done "manually" in this case; it would be useful to have a way to move the divider above the labels though.
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
N/A
Is there anything else we should know?
N/A

Adding class="mat-tab-group-inverted-header" to my nav mat-tab-nav-bar works as a workaround.


text:
Autocomplete - Need way to set first option as active manually

Bug, feature request, or proposal:
Feature Request
What is the expected behavior?
Should be able to manually/programmatically set the first option in the autocomplete panel as active and select when the user presses enter.
What is the current behavior?
User must either use the down key or hover with the mouse on the option to make it active.
What are the steps to reproduce?
N/A
What is the use-case or motivation for changing an existing behavior?
Our users are going to be limited to selecting only options from the autocomplete. We're experiencing problems where users are either typing in a partial value or the full value, hitting the enter key, and not understanding why that option isn't being selected.
See attached images

Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Angular - 4.4.6
Material - 2.0.0-beta.12
Is there anything else we should know?
Seems similar to this issue, but not quite: https://github.com/angular/material2/issues/3334
The material Select component has this feature, so it doesn't seem too far of a stretch to have the same behavior for the autocomplete as an optional setting.

You actually can do this already by acting on events on the input underlying MatAutocomplete.
In your html:
<input matInput placeholder="Pick a state" aria-label="State" [matAutocomplete]="auto"
      [formControl]="stateCtrl" (keyup.enter)="chooseFirstOption()">
<mat-autocomplete #auto="matAutocomplete">
  <mat-option *ngFor="let state of filterStates(this.stateCtrl.value)" [value]="state">{{state}}</mat-option>
</mat-autocomplete>

In your component class:
@Component({
  selector: 'autocomplete-overview-example',
  templateUrl: 'autocomplete-overview-example.html',
  styleUrls: ['autocomplete-overview-example.css']
})
export class AutocompleteOverviewExample {
  stateCtrl: FormControl;
  filteredStates: Observable<any[]>;
  states: string[] = [Arkansas', 'California', 'Florida',  'Texas'];
  @ViewChild(MatAutocomplete) matAutocomplete: MatAutocomplete;

  filterStates(name: string): string[] {
    return this.states.filter(state =>
      state.toLowerCase().indexOf(name.toLowerCase()) === 0);
  }

  chooseFirstOption(): void {
    this.matAutocomplete.options.first.select();
  }
}

The chooseFirstOption, will select the first item in the current options.

Thanks, that helps with the selection, but there's no indication that the user is going to select the first one - is there an easy way to also apply the .mat-active class to the first option?
I've tried several ways, and cannot figure it out.
Thanks much.

Nevermind, I got it.
this.matAutocomplete.options.first.setActiveStyles();
Thanks again!

Hi @josephperrott . I might need you to re-open this issue.
The solutions above only solve the first part of the feature request. I got the select working, and I can manually set the active styles to the first option, but I think it still requires me to write my own KeyManager. Even though the first option is active, when I press the down arrow, the Autocomplete still wants to make the first option active - it doesn't adjust the index accordingly.
The typeahead using bootstrap and AngularJS has the exact desired behavior for a better working example: https://angular-ui.github.io/bootstrap/#!#typeahead
Let me know if you need more clarity, or if there's a solution for this second half.

Hey @lcecil ,
I wanted the same behavior you were after and got it working with a few small tweaks:
in component.ts:
highlightFirstOption(event): void {
    if (event.key == "ArrowDown" || event.key == "ArrowUp") {
      return;
    }
    this.matAutocomplete._keyManager.setFirstItemActive();
  }

  selectFirstOption(): void {
    this.matAutocomplete.options.first.select();
  }

in component.html:
(keyup.enter)="selectFirstOption()"                           (keyup)="highlightFirstOption($event)"

Hi @smitelij,
Thanks for the suggestion, I'll give it a try. Although I'm a little surprised you can access the _keyManager, as I would assume that preceding underscore would mean that it's private.
I also opened another issue, since I didn't feel like the issue was fully addressed here, if you want to keep tabs on it: https://github.com/angular/material2/issues/8423

Also, @smitelij , if you're using something like (onSelectionChange)="selectOption()" on your <mat-option> component, you don't need that selectFirstOption() method. I believe the fact that the first item is active handles that for you.

@lcecil Good point! I had gotten that first part onSelect working before getting the highlighting working and didn't think about that.

Hi @lcecil
Where did you put this code? this.matAutocomplete.options.first.setActiveStyles();
I can't get the highlighting to work.

Hi @NexPlex ,
What version of @angular/material are you using? Some of the more recent versions (I think 5+) have this functionality implemented already.
Just add the autoActiveFirstOption attribute to your <mat-autocomplete> selector.
Check out the documentation here:
https://material.angular.io/components/autocomplete/api#directives

Hi @Icecil,
Thank you for the quick reply. I am currently committed to material@2.0.0-beta.12 and Angular 4.4.7. I say your fix was related to material@2.0.0-beta.12. We can't upgrade at this time. Did you get the first item to highlight with beta.12? I have highlighting working with the up and down arrows. just can't get the top item to highlight.
+-- @angular/material@2.0.0-beta.12
@angular/animations@4.4.7
+-- @angular/cdk@2.0.0-beta.12
+-- @angular/common@4.4.7
+-- @angular/compiler@4.4.7
+-- @angular/compiler-cli@4.4.7
+-- @angular/core@4.4.7
+-- @angular/forms@4.4.7
+-- @angular/http@4.4.7

Hmm, I can't quite remember, but I do think that you can do it by accessing the _keyManager.
So that would look like: this.matAutocomplete._keyManager.setFirstItemActive();
See smitelij's comment from 12/13. Good luck!

That worked well for me:
.html
<input matInput placeholder="Product" [matAutocomplete]="auto" formControlName="product" (blur)="chooseFirst">

<mat-autocomplete #auto="matAutocomplete" autoActiveFirstOption>
    <mat-option *ngFor="let product of filteredProducts | async" [value]="product.name">
        {{product.name}}
    </mat-option>
</mat-autocomplete>

.ts
@ViewChild('auto') autoComplete: MatAutocomplete;
form: FormGroup;

chooseFirst(): void {
        if (this.autoComplete.options.length > 0) {
            this.form.get('product').patchValue(this.autoComplete.options.first.value);
        }
    }

authors: NexPlex douglasgsouza josephperrott lcecil smitelij


text:
Indeterminate progress bar animation broken on Firefox 57

Bug, feature request, or proposal:
Bug
What is the expected behavior?
Progress bar animation plays smoothly.
What is the current behavior?
Progress bar animation shows breaks in frames.
What are the steps to reproduce?
The issue can be seen on the docs site. https://material.angular.io/components/progress-bar/overview
I have also uploaded a gif of what I am seeing to https://imgur.com/a/lKxdL.
What is the use-case or motivation for changing an existing behavior?
N/A
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
The versions of Angular, Material, and TypeScript that the https://material.angular.io site is using at the time of writing. The browser is Firefox 57.
Is there anything else we should know?
The progress spinner is fine. It's just the progress bar that seems to be experiencing an issue whilst playing the animation.
Granted that the FF 57 has only been out in release form for a day but I thought this should be tracked for a fix.

works fine in my firefox v57

Closing as a duplicate of https://github.com/angular/material2/issues/7606.

authors: crisbeto melton3 praneetloke


text:
Enhancement of missing public API documentation

Follow-up of #8832

Thank you for the review, @crisbeto . I made according changes to the docs.

@crisbeto I also changed that other occurrence.
Shall the docs on the one id attribute that is marked as readonly also be changed?


text:
feat(expansion): Allow expansion indicator positioning

#6726
Allows expansion indicator to be positioned at start, end and hidden.

@jelbourn When you have a moment can you take a look at this PR?  I don't remember where we landed on this one.

@josephperrott as discussed we're going to keep hideToggle and make togglePosition separate to avoid the breaking API change.

Closing in favor of #8199

authors: jelbourn josephperrott


text:
protractor exited with code: -1073741819

I run E2E tests using Protractor via grunt-protractor-runner. In a particular test case, when an element is clicked on, I get this most of the time:
Warning: Tests failed, protractor exited with code: -1073741819 Use --force to continue.

There is no further information about what's going on, no stack trace, no error log. The error is not browser specific - it happens with both Firefox and Chrome.
Normally I specify seleniumServerJar in the Protractor config in grunt, but I've also tried starting webdriver-manager manually and specifying seleniumAddress instead. Same outcome in both cases, and the webdriver log doesn't show any errors, just normal operation messages.
The error happens 9 times out of 10, so it's intermittent but frequent.
Some version information:

webdriver-manager: 2.45.0
angular: 1.3.15
grunt-protractor-runner: 2.0.0
Protractor: 2.1.0

How can I get more information about what's going on? Can I patch Protractor to emit more information?

Never mind, the culprit appears to have been an old Node version. Upgrading to latest fixes the problem. Closing...

repo: angular/protractor


text:
How to click all elements with a particular locator through protractor one by one?

This is what I am trying to do - I am trying to click on an element with a locator and on clicking that element, 2 more links are displayed. I want to individually click on those 2 links and then do an assertion.
However, the code clicks first element and then stops. This is my code -
self.expandHierarchy = function() {
var hrchy = element.all(by.css('.ng-binding.CanExpand'));
hrchy.each(function (elem) {
elem.click();
});
};
How can I do the same through protractor?

Hi there!
Your question is better suited for StackOverflow or Gitter. Please ask a question there with the 'protractor' tag or post in the Gitter Channel to get help.
From the the getting help section of the README:

Please ask usage and debugging questions on StackOverflow (use the "protractor" tag) or in the Angular discussion group. (Please do not ask support questions here on Github.)

Thanks!

authors: NickTomlin allaboutapis


text:
feat(zonespec): add a spec for asynchronous tests

This spec is constructed with a done callback and a fail callback,
and waits until all asynchronous tasks are completed before
exiting.

WIP - still needs tests.

Tests are now added! Please take a look. cc @mhevery @vikerman

This will be updated on top of https://github.com/angular/zone.js/pull/275