Currently utilizing Angular 2 in a project that is compiled with TypeScript.
Encountering an issue when attempting to generate a blob image:
Error TS2339: Property 'webkitURL' does not exist on type 'Window'The TypeScript code causing the error is:
public url = window.URL || window.webkitURL;
this.photo = this.url.createObjectURL( res );
An issue has occurred with error code TS2339: Property 'webkitURL' is not found in type 'Window'
The lib.d.ts file does not include browser-specific content. However, you can easily access it using (window as any).webkitURL. This process is known as a type assertion.
The common usage of (as any) for type assertion is a handy quickfix provided by alm: https://basarat.gitbooks.io/alm/content/features/quickfix.html
Here is the updated solution for TypeScript version 2.1.5:
interface BrowserWindow {
webkitURL?: any;
}
declare var window: BrowserWindow;
if (window.webkitURL !== undefined) {
console.log(window.webkitURL);
}
In the code snippet above, we defined an interface called BrowserWindow that may or may not have webkitURL property and then implemented a check to ensure its existence.
I found success with this method. I am currently running TypeScript version 2.0.3.
Include this code outside of the class:
interface Window { logged_user: Object }
Then, whenever you need to access this property, simply use it like so:
window.logged_user = {};//insert your data here
Here are two solutions to avoid TypeScript errors when using window.webkitURL:
interface BrowserWindow {
webkitURL: any;
}
declare var browserWindow: BrowserWindow;
//No more TypeScript error will be thrown on browserWindow.webkitURL
Another way is to use
(<any>browserWindow).webkitURLConsider the following object: const myObject = { 1: 10, 2: 20, 3: 30, 4: 40, 5: 50, }; Suppose we also have a number, let's say 25. Now, I want to iterate over the myObject using Object.entries(myObject), and obtain a specific result. For ...
When reusing a module in multiple places, you typically use module.exports = yourModuleClassName to make the module exportable. Then, when you want to use it elsewhere, you can simply import it with import yourModuleClassName from 'yourmodulePath&apos ...
As I work on developing an application using dependency injection with tsyringe, I came across a case where a service receives the repository as a dependency. Here is an example: import { injectable, inject } from 'tsyringe' import IAuthorsRepos ...
Need help with sending a json to an ajax call and reading it when it's sent. Plus, the json structure seems off due to the backslashes... This is the ajax function in question: function find(){ var type = $('#object_type').val( ...
While executing karma from a grunt task, I encountered the following warning: Running "karma:unit" (karma) task Warning: The api interface has changed. Please use server = new Server(config, [done]) server.start() instead. Use --force to continue. A ...
I've successfully implemented Google Maps V3 in my project, but I'm encountering an issue with grey tiles appearing on the map. I attempted to fix this problem by triggering a resize event using the following code snippet: google.maps.event.trig ...
When I retrieve an array in a loop and pass it through an ajax call to my C# method, I'm encountering a problem where only null values are being received in my parameter. The count of the array is coming through, but the actual data seems to be lost. ...
Recently, I started using the new HttpClient and encountered an issue where the response is not cast with the provided type when making a call. I attempted to use both an interface and a class for casting, but it seems that only interfaces work as shown in ...
On my Rails form, I have a basic setup like the following: <%= form_for @song do |f| %> <p> <%= f.label :url %><br> <%= f.text_field :url %> </p> <p> <%= f.submit %> </p> <% en ...
While creating a URL in my angular app using new URL, I have encountered an issue that it works on all browsers except IE11. To resolve this problem, I attempted to add "url-polyfill" to my "package.json" and imported 'url-polyfill' in the polyf ...
Here is the coding snippet: driver.get(url).then(function(){ txtFnn = driver.findElement(webdriver.By.xpath(xpath)); return txtFnn; }).then(function(){ txtFnn.sendkeys("12345678"); }) Issue: An error occurred: Typ ...
While many questions focus on grouping nodes based on similarity, I am interested in grouping nodes simply based on their proximity. I have a vast collection of densely packed nodes, potentially numbering in the millions. These nodes take up space on-scre ...
Two get requests are returning the following data: [{ id: 1, hId: 2 }, { id: 6, hId: 1 }] The second request returns: [{ id: 1, name: 'Bob' }, { id: 2, name: 'Billy' }, { id: 6, name: 'John' }] The object ...
I've seen this question asked many times about how to trigger a function once all AJAX calls have finished. The typical solution involves using jquery.stop(). However, my situation is unique - I want to display a confirmation banner only after all AJA ...
I am currently facing a minor issue in my Django application. I am attempting to utilize a modal from Bootstrap 4 along with AJAX to create a new object. Below you can view the code I used. However, when the user clicks the button, instead of seeing the mo ...
In Angular, I want to store the last 100 items to display. Currently, I am using an array and inserting items with 'array.push'. If this method is not effective for this scenario, what alternative approach can I take? Here is a snippet of the co ...
Having difficulty integrating PrimeNG components (beta5) with Angular2 (rc.1). Whenever attempting to utilize a component, such as the menubar, the following error is consistently encountered: No Directive annotation found on Menubar New to Angular and ...
After setting up my ad HTML like this: <div class="ad-container"> <p>Ad slot #1</p> <div id="ad-slot-1" class="ad-slot"></div> </div> I implemented the code below to collapse the ad if ...
To simplify, I use two tables for a chatbox: Conversation and Message Conversations ID Status 1 open 2 open Messages Conversation ID Text Date 1 'ffff' (random date) 1 'asdf' (random date) 1 '3123123123&ap ...
When a user selects a value from the first select box, a second select box is dynamically created using JavaScript. This JS triggers a PHP file to query a MYSQL database for relevant items based on the initial selection. The issue I am facing is that the ...