Encountering an unresolved variable issue in Angular 2 rc.1 and PhpStorm 2016.1.2

Ever since I upgraded Angular 2 in my project to rc.1, my IDE, PHPStorm 2016.1. has been having trouble finding many properties and static functions, such as those from the Observable class (rxjs) like Observable.of and Observable.forkJoin.

I primarily use TypeScript for Angular 2 development.

It seems like my issue is similar to this question: Angular 2 2.0.0-rc.1 Property 'map' does not exist on type 'Observable<Response>', although there isn't much helpful information available for PHPStorm specifically.

Here's an image illustrating the problem: the unresolved static function

This is how I import Observable - which worked well with Angular 2 beta 16:


import 'rxjs/Rx';
import {Observable} from "rxjs/Observable";

A snippet of my package.json file - if it provides any insight:


"rxjs": "5.0.0-beta.6",
"typescript": "~1.9.0-dev.20160526-1.0",
"typings": "^0.8.1",,
"gulp-typescript": "^2.13.4",

Unfortunately, auto-completion doesn't seem to be functioning properly :/

Is this possibly a bug within Angular 2? Or is it an issue stemming from RxJS?

Are there any workarounds to resolve this frustrating error?

Answer №1

PHPStorm's Angular2 support does not currently work with Angular2 RC. The issue has been reported and is being fixed. More information can be found at WEB-21541. The fix is scheduled to be available in the 2016.2 update.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is it possible to employ a jQuery handler as the selector for the .on() method?

Can a jQuery handler $(...) be used as the selector for .on()? The code snippet below illustrates this: how can I change the circle's color to blue without having a plain text representation of my selector, but still using a handler? // This works. ...

Encountering Issue: Trying to modify the getter of an immutable property in React Native

I encountered an error while working on my react-native project The error message reads: Attempting to change the getter of an unconfigurable property import * as React from 'react'; import { Text, View, StyleSheet } from 'react-native&ap ...

Here's a way to programmatically append the same icon to multiple li elements generated using document.createElement:

I am new to creating a to-do app and need some guidance. When a user enters a task, I successfully create a list item for that task. However, I am unsure how to add a delete icon next to the newly created li element. Can someone please help me out? Below ...

The VLC WebPlugin puts a halt on websocket activity during playback

I currently have a basic HTML/JS application that includes an embedded VLC WebPlugin and several methods for play/pause functionality. This application is being managed by another JavaScript file through a straightforward server/websocket C# setup. The con ...

Experience the power of React TypeScript where functions are passed as props, but access is restricted

Currently, I am working on creating a toggle button using react and typescript. In order to challenge myself, I have decided to pass a function as a prop to a child component to implement a complex feature. From what I remember, utilizing 'this.props& ...

The updated PHP version isn't reflected in the command line for PhpStorm and XAMPP

https://i.sstatic.net/5qQCK.png Dealing with OSX El Capitan and trying to configure PhpStorm with the Laravel environment has been quite a challenge for me. I went through the process of setting up Composer and creating a project using laravel/laravel fro ...

What is the best way to customize the tooltip in VS Code for TypeScript type aliases?

Here is an issue with the code snippet below: type char = 'a' | 'b' | 'c' | 'd' | 'e' | 'f'; const s: string = 'foo'; const [c]: char = s; // [ERROR]: Type 'string' is not assi ...

How can I retrieve the document id from Firestore using Angular?

I attempted to generate an auto document ID in Firestore and retrieve the document ID in Angular 8 using the code provided. However, I am encountering an issue where I only receive the document ID after the execution has been completed. Can someone pleas ...

Transferring information from Child to Parent using pure Javascript in VueJS

I am familiar with using $emit to pass data from child components to parent components in VueJS, but I am trying to retrieve that value in a JavaScript function. Here is my situation: Parent Component created () { this.$on('getValue', func ...

Tips for resolving Typescript type error when overriding MuiContainer classes

My application is divided into two main files: (https://codesandbox.io/s/react-ts-muicontainer-override-yywh2) //index.tsx import * as React from "react"; import { render } from "react-dom"; import { MuiThemeProvider } from "@material-ui/core/styles"; imp ...

Node.js Firebase 3.0 authentication integration

After upgrading Firebase to version 3.0 and needing to migrate, I encountered an issue with the authentication of my node server. The code in question is as follows: var firebase = require('firebase'); var config = { apiKey: "<my apiKey> ...

Setting up only two input fields side by side in an Angular Form

I'm fairly new to Angular development and currently working on creating a registration form. I need the form to have two columns in a row, with fields like Firstname and Lastname in one row, followed by Phone, Email, Password, and Confirm Password in ...

Tips for accessing the information received from an AJAX call

When making an AJAX post request for processed data from the database in the form of an array [value1, value2, value3,...,valueN], I aim to use it on a ChartJS object. Here is the AJAX Request: $(document).ready($.post('callMeForAJAX.jsp', func ...

How can Angular JS handle multiple validators being triggered at once?

Hey there, I'm currently working with validators in my Angular form setup. Here's a snippet of how it looks - I utilize Validators.compose to combine custom validators. The errors from these validators are then displayed on the HTML component. My ...

Angular Material is being improperly utilized by misusing the <label for=FORM_ELEMENT> tag

Encountering an issue with Angular Material while attempting to incorporate a <mat-label> element within a basic <mat-form-field>: https://i.sstatic.net/zQ4pp.png Below is the troublesome code snippet: <mat-form-field color="accent&qu ...

Authenticating the identity of the client application - the client is currently within the browser

I have a PHP backend (although it's not really important) and a Javascript client that runs in the browser. Here is how the application operates: The user accesses a URL and receives raw templates for rendering data An Ajax GET query is sent to the ...

Unexpected results occurring during JavaScript refactoring process

Having this repetitive code snippet that switches between two radio buttons being checked within my $(document).ready(): $(document).ready(function () { $("#New").click(function () { var toggleOn = $("#New"); var tog ...

Create a tuple type that encompasses all possible paths within a recursive object configuration

Consider the following templates for 'business' types, representing compound and atomic states: interface CompoundState<TName extends string, TChildren extends { [key: string]: AnyCompoundState | AnyAtomicState }> { type: 'parent&ap ...

The custom directive containing ng-switch isn't being reevaluated when the value is updated

I have developed a unique directive that acts as a reusable form. The form includes an error message display section which utilizes ng-switch: <div ng-switch="status"> <span ng-switch-when="Error" class="text-error">An Error occurred</spa ...

How can you prevent multiple instances of JavaScript objects from being disposed of after they have completed their task?

I'm facing an issue with the code snippet below: $(document).ready(function() { $('.container').ready(function() { var v = new Video($(this)); v.load(); }); }); I'm trying to prevent the object 'v&apos ...